Xilize example

links and images:image modifiers

In addition to the basic modifiers, special ones can be applied to images for vertical alignment and float.

Note: that image modifiers are separated from the image URL by a space.

Xilize markup	browser rendering
mgTm !^ colors.png! mgTm mgTm !- colors.png! mgTm mgTm !~ colors.png! mgTm mgTm[!^ colors.png!][!- colors.png!][!~ colors.png!][!colors.png!]mgTm p<>. If this paragraph is long enough it will flow around both floating images. Images can float !<)) colors.png! !>(( colors.png! left and right. Notice that padding has been added to the image modifiers to create whitespace and this paragraph has been given the @<>@ justify text modifier.	mgTm mgTm mgTm mgTm mgTm mgTm mgTmmgTm If this paragraph is long enough it will flow around both floating images. Images can float left and right. Notice that padding has been added to the image modifiers to create whitespace and this paragraph has been given the `<>` justify text modifier.

XHTML generated

<p>mgTm <img src="colors.png" style="vertical-align:text-top;"
 /> mgTm</p>

<p>mgTm <img src="colors.png" style="vertical-align:middle;" /> mgTm
 </p>

<p>mgTm <img src="colors.png" style="vertical-align:text-bottom;" />
 mgTm</p>

<p>mgTm<img src="colors.png" style="vertical-align:text-top;" /><img
 src="colors.png" style="vertical-align:middle;" /><img src="colors.png" style="vertical-align:text-bottom;"
 /><img src="colors.png" />mgTm</p>

<p style="text-align:justify;">If this paragraph is long enough it will flow
 around both floating images. Images can float <img src="colors.png" style="float:left;padding-right:2em;"
 />  <img src="colors.png" style="float:right;padding-left:2em;" /> left
 and right.  Notice that padding has been added to the image modifiers to create
 whitespace and this paragraph has been given the <code>&lt;&gt;</code>
 justify text modifier.</p>