CSS classes and IDs

You can apply CSS classes and IDs to phrase modifiers or block modifiers.

Textile
1
p(my-class). This is a paragraph that has a class and this *(#special-phrase)emphasized phrase* has an id.
Browser

This is a paragraph that has a class and this emphasized phrase has an id.

HTML
1
<p class="my-class">This is a paragraph that has a class and this <strong id="special-phrase">emphasized phrase</strong> has an id.</p>
Textile
1
p(#my-paragraph). This is a paragraph that has an id.
Browser

This is a paragraph that has an id.

HTML
1
<p id="my-paragraph">This is a paragraph that has an id.</p>

You can specify both class and ID, but the class must always come first.

Textile
1
div(myclass#myid). This div has both a CSS class and ID.
Browser
This div has both a CSS class and ID.
HTML
1
<div class="myclass" id="myid">This div has both a <span class="caps">CSS</span> class and ID.</div>

CSS styles

Apply CSS styles directly to block or phrase modifiers by putting the style rules in curly braces.

Textile
1
p{color:blue;letter-spacing:.5em}. Spacey blue
Browser

Spacey blue

HTML
1
<p style="color:blue;letter-spacing:.5em;">Spacey blue</p>

Language

Specify the language of text with square brackets.

Textile
1
p[fr]. Parlez-vous français ?
Browser

Parlez-vous français ?

HTML
1
<p lang="fr">Parlez-vous français ?</p>

Alignment

Text inside blocks can be aligned in four ways:

Textile
1
2
3
4
5
6
7
p<. align left

p>. align right

p=. centered

p<>. justified justified justified justified justified justified justified justified justified
Browser

align left

align right

centered

justified justified justified justified justified justified justified justified justified

HTML
1
2
3
4
<p style="text-align:left;">align left</p>
<p style="text-align:right;">align right</p>
<p style="text-align:center;">centered</p>
<p style="text-align:justify;">justified justified justified justified justified justified justified justified justified</p>

Indentation

Text can be indented with single parentheses. For each left paren, left pad 1em. For each right paren, right pad 1em. They may be combined for left and right padding.

Textile
1
2
3
4
5
p(. Left pad 1em.

p)). Right pad 2em.

p(). Pad both left and right sides 1em.
Browser

Left pad 1em.

Right pad 2em.

Pad both left and right sides 1em.

HTML
1
2
3
<p style="padding-left:1em;">Left pad 1em.</p>
<p style="padding-right:2em;">Right pad 2em.</p>
<p style="padding-left:1em;padding-right:1em;">Pad both left and right sides 1em.</p>