!heading level 1 !!heading level 2 !!!heading level 3 !!!!heading level 4 !!!!!heading level 5 !!!!!!heading level 6
<h1 id="heading-level-1" class="st-markup"> heading level 1</h1> <h2 id="heading-level-2" class="st-markup"> heading level 2</h2> <h3 id="heading-level-3" class="st-markup"> heading level 3</h3> <h4 id="heading-level-4" class="st-markup"> heading level 4</h4> <h5 id="heading-level-5" class="st-markup"> heading level 5</h5> <h6 id="heading-level-6" class="st-markup"> heading level 6</h6>
* bulleted * lists + Bulleted lists + with a plus - Bulleted lists - With a minus * Nested *- bulleted *-+ lists *~ You can also *~ Do bulletd lists *~+~ that don't have bullets :) # ordered # lists ##1 Arabic ##1 numbers ##1#a Lower ##1#a alpha ##1#a#A upper ##1#a#A alpha ##1#a#A#i lower ##1#a#A#i roman ##1#a#A#i#I upper ##1#a#A#i#I roman
- Bulleted lists
- With a minus

<ul class="st-markup"> <li>bulleted</li> <li>lists</li> </ul> <ul class="st-markup"> <li>Bulleted lists</li> <li>with a plus</li> </ul> <p class="st-markup">- Bulleted lists<br /> - With a minus</p> <ul class="st-markup"> <li>Nested</li> <li>- bulleted</li> <li>-+ lists</li> </ul> <ul class="st-markup" style="list-style-type: none"> <li>You can also</li> <li>Do bulletd lists <ul class="st-markup" style="list-style-type: none"> <li>that don't have bullets <img class="smiley" src="/images/smiley_side.gif" alt="Smiley" /></li> </ul> </li> </ul> <ol class="st-markup"> <li>ordered</li> <li>lists <ol class="st-markup" style="list-style-type: decimal"> <li>Arabic</li> <li>numbers <ol class="st-markup" style="list-style-type: lower-alpha"> <li>Lower</li> <li>alpha <ol class="st-markup" style="list-style-type: upper-alpha"> <li>upper</li> <li>alpha <ol class="st-markup" style="list-style-type: lower-roman"> <li>lower</li> <li>roman <ol class="st-markup" style="list-style-type: upper-roman"> <li>upper</li> <li>roman</li> </ol> </li> </ol> </li> </ol> </li> </ol> </li> </ol> </li> </ol>
auto highlighted links: http://www.keithdevens.com/ specified links: "Keith Devens.com"="http://www.keithdevens.com/"
auto highlighted links: http://www.keithdevens.com/
specified links: Keith
Devens.com
<p class="st-markup">auto highlighted links: <a href="http://www.keithdevens.com/">http://www.keithdevens.com/</a><br /> specified links: <a href="http://www.keithdevens.com/">Keith Devens.com</a></p>
*emphasis* **strong** _underline_ =monospaced= --strikeout-- ---3l !!!Emphasis variations ***strong emphasis*** *_emphasis underlined_* - style 1 _*emphasis underlined*_ - style 2 *=emphasis monospaced=* - style 1 =*emphasis monospaced*= - style 2 *--emphasis strikeout--* - style 1 --*emphasis strikeout*-- - style 2 ---3l !!!Strong variations **_strong underlined_** - style 1 _**strong underlined**_ - style 2 **=strong monospaced=** - style 1 =**strong monospaced**= - style 2 **--strong strikeout--** - style 1 --**strong strikeout**-- - style 2 ---3l !!!Monospace variations =_monospace underlined_= - style 1 _=monospace underlined=_ - style 2 =--monospace strikeout--= - style 1 --=monospace strikeout=-- - style 2 ---3l !!!Underline variations _--underline strikeout--_ - style 1 --_underline strikeout_-- - style 2 ---3l ***=_--emphasis strong monospaced underlined strikeout--_=*** --***=_emphasis strong monospaced underlined strikeout_=***-- _--***=emphasis strong monospaced underlined strikeout=***--_ =_--***emphasis strong monospaced underlined strikeout***--_= *=_--**emphasis strong monospaced underlined strikeout**--_=* **=_--*emphasis strong monospaced underlined strikeout*--_=** **_--*=emphasis strong monospaced underlined strikeout=*--_**
emphasis
strong
underline
monospaced=
strikeout
strong emphasis
emphasis
underlined - style 1
emphasis
underlined - style 2
=emphasis monospaced= - style 1
emphasis monospaced= - style 2
emphasis strikeout - style
1
emphasis strikeout - style 2
strong underlined - style 1
strong
underlined - style 2
=strong monospaced= - style 1
strong monospaced= - style 2
strong strikeout -
style 1
strong strikeout - style 2
monospace underlined= - style 1
=monospace underlined= - style 2
monospace strikeout= - style 1
=monospace strikeout= - style 2
underline strikeout - style 1
underline strikeout - style 2
=emphasis strong monospaced underlined
strikeout=
=emphasis strong monospaced underlined
strikeout=
=emphasis strong monospaced underlined
strikeout=
emphasis strong monospaced underlined strikeout=
=emphasis strong monospaced underlined
strikeout=
=emphasis strong monospaced underlined
strikeout=
=emphasis strong monospaced underlined
strikeout=
<p class="st-markup"><em>emphasis</em><br /> <strong>strong</strong><br /> <em style="font-style: normal; text-decoration: underline">underline</em></p> <pre class="st-markup">monospaced= </pre> <p class="st-markup"><strike>strikeout</strike></p> <hr class="st-markup" style="width: 30%; float: left" /> <h3 id="Emphasis-variations" class="st-markup"> Emphasis variations</h3> <p class="st-markup"><em><strong>strong emphasis</strong></em><br /> <em><em style="font-style: normal; text-decoration: underline">emphasis underlined</em></em> - style 1<br /> <em style="font-style: normal; text-decoration: underline"><em>emphasis underlined</em></em> - style 2<br /> <em>=emphasis monospaced=</em> - style 1</p> <pre class="st-markup"><em>emphasis monospaced</em>= - style 2 </pre> <p class="st-markup"><em><strike>emphasis strikeout</strike></em> - style 1<br /> <strike><em>emphasis strikeout</em></strike> - style 2</p> <hr class="st-markup" style="width: 30%; float: left" /> <h3 id="Strong-variations" class="st-markup"> Strong variations</h3> <p class="st-markup"><strong><em style="font-style: normal; text-decoration: underline">strong underlined</em></strong> - style 1<br /> <em style="font-style: normal; text-decoration: underline"><strong>strong underlined</strong></em> - style 2<br /> <strong>=strong monospaced=</strong> - style 1</p> <pre class="st-markup"><strong>strong monospaced</strong>= - style 2 </pre> <p class="st-markup"><strong><strike>strong strikeout</strike></strong> - style 1<br /> <strike><strong>strong strikeout</strong></strike> - style 2</p> <hr class="st-markup" style="width: 30%; float: left" /> <h3 id="Monospace-variations" class="st-markup"> Monospace variations</h3> <pre class="st-markup"><em style="font-style: normal; text-decoration: underline">monospace underlined</em>= - style 1 </pre> <p class="st-markup"><em style="font-style: normal; text-decoration: underline">=monospace underlined=</em> - style 2</p> <pre class="st-markup"><strike>monospace strikeout</strike>= - style 1 </pre> <p class="st-markup"><strike>=monospace strikeout=</strike> - style 2</p> <hr class="st-markup" style="width: 30%; float: left" /> <h3 id="Underline-variations" class="st-markup"> Underline variations</h3> <p class="st-markup"><em style="font-style: normal; text-decoration: underline"><strike>underline strikeout</strike></em> - style 1<br /> <strike><em style="font-style: normal; text-decoration: underline">underline strikeout</em></strike> - style 2</p> <hr class="st-markup" style="width: 30%; float: left" /> <p class="st-markup"><em><strong>=<em style="font-style: normal; text-decoration: underline"><strike>emphasis strong monospaced underlined strikeout</strike></em>=</strong></em><br /> <strike><em><strong>=<em style="font-style: normal; text-decoration: underline">emphasis strong monospaced underlined strikeout</em>=</strong></em></strike><br /> <em style="font-style: normal; text-decoration: underline"><strike><em><strong>=emphasis strong monospaced underlined strikeout=</strong></em></strike></em></p> <pre class="st-markup"><em style="font-style: normal; text-decoration: underline"><strike><em><strong>emphasis strong monospaced underlined strikeout</strong></em></strike></em>= </pre> <p class="st-markup"><em>=<em style="font-style: normal; text-decoration: underline"><strike><strong>emphasis strong monospaced underlined strikeout</strong></strike></em>=</em><br /> <strong>=<em style="font-style: normal; text-decoration: underline"><strike><em>emphasis strong monospaced underlined strikeout</em></strike></em>=</strong><br /> <strong><em style="font-style: normal; text-decoration: underline"><strike><em>=emphasis strong monospaced underlined strikeout=</em></strike></em></strong></p>
|table|cell|cell|cell| |table|cell||cell| |you can see how colspan works||||
| table | cell | cell | cell |
| table | cell | cell | |
| you can see how colspan works | |||
<table border="1" class="st-markup"> <tr><td colspan="1">table</td><td colspan="1">cell</td><td colspan="1">cell</td><td colspan="1">cell</td></tr> <tr><td colspan="1">table</td><td colspan="2">cell</td><td colspan="1">cell</td></tr> <tr><td colspan="4">you can see how colspan works</td></tr> </table>
img:"/images/fun/heimlich.gif":"Heimlich! From 'A Bug's Life'"

<p class="st-markup"><img src="/images/fun/heimlich.gif" alt="Heimlich! From 'A Bug's Life'" /></p>
$color:blue$you can use any (inline) style you want$ $background-color: #900; color:white; font-size: 16pt; line-height: 1.5em; font-family: Georgia; border: medium #0d0 dashed;$arbitrary styles$
you can use any (inline) style you want
arbitrary styles
<p class="st-markup"><span style="color:blue; display: inline; position: static">you can use any (inline) style you want</span><br /> <span style="background-color: #900; color:white; font-size: 16pt; line-height: 1.5em; font-family: Georgia; border: medium #0d0 dashed;; display: inline; position: static">arbitrary styles</span></p>
> Blockquoted text.
Blockquoted text.
<blockquote class="st-markup"><p>Blockquoted text.</p></blockquote>
= Block preformatted text = this is text in a <pre> tag. = This doesn't interfere with =inline monospaced=, however (as long as you put a beginning space, and the first beginning space is removed if it exists) =Blah =I can even put monospaced= at the beginning of a line and it will treat it differently.
Block preformatted text this is text in a <pre> tag. This doesn't interfere with =inline monospaced=, however (as long as you put a beginning space, and the first beginning space is removed if it exists) Blah I can even put monospaced= at the beginning of a line and it will treat it differently.
<pre class="st-markup">Block preformatted text this is text in a <pre> tag. This doesn't interfere with =inline monospaced=, however (as long as you put a beginning space, and the first beginning space is removed if it exists) Blah I can even put monospaced= at the beginning of a line and it will treat it differently. </pre>
;You can put any <b>arbitrary</b> <font color="red">HTML</font> if you precede a line with a semicolon. ; Notice that **styles** that would normally be special are *meaningless* in _HTML_
You can put any <b>arbitrary</b> <font color="red">HTML</font> if you precede a line with a semicolon. Notice that **styles** that would normally be special are *meaningless* in _HTML_
First, normal: three hyphens begin a line --- Second, three hyphens begin a line, and one or two numbers (representing the percentage width of the line) immediately follow it. If one number follows it, a zero is appended so 5 becomes 50. 0 doesn't work :). ---5 If two numbers follow, that's the exact percentage width. ---75 If you give a width, you can also align left (uppercase or lowercase "L"): ---5L or right (uppercase or lowercase "R"): ---23r And that's it.
First, normal: three hyphens begin a line
Second, three hyphens begin a line, and one or two
numbers
(representing the percentage width of the line) immediately follow
it.
If one number follows it, a zero is appended so 5 becomes 50. 0 doesn't
work
.
If two numbers follow, that's the exact percentage width.
If you give a width, you can also align left (uppercase or lowercase "L"):
or right (uppercase or lowercase "R"):
And that's it.
<p class="st-markup">First, normal: three hyphens begin a line</p> <hr class="st-markup" /> <p class="st-markup">Second, three hyphens begin a line, and one or two numbers<br /> (representing the percentage width of the line) immediately follow it.<br /> If one number follows it, a zero is appended so 5 becomes 50. 0 doesn't work <img class="smiley" src="/images/smiley_side.gif" alt="Smiley" />.</p> <hr class="st-markup" style="width: 50%" /> <p class="st-markup">If two numbers follow, that's the exact percentage width.</p> <hr class="st-markup" style="width: 75%" /> <p class="st-markup">If you give a width, you can also align left (uppercase or lowercase "L"):</p> <hr class="st-markup" style="width: 50%; float: left" /> <p class="st-markup">or right (uppercase or lowercase "R"):</p> <hr class="st-markup" style="width: 23%; float:right" /> <p class="st-markup">And that's it.</p>
:) :D :( :P :/ :\ :| ;)


<p class="st-markup"><img class="smiley" src="/images/smiley_side.gif" alt="Smiley" /> <img class="smiley" src="/images/smiley_happy.gif" alt="Smiley (big smile)" /> <img class="smiley" src="/images/smiley_frown.gif" alt="Smiley frowning" /><img class="smiley" src="/images/smiley_tongue.gif" alt="Smiley sticking out its tongue" /> <img class="smiley" src="/images/smiley_ohwell.gif" alt="Smiley 'oh well'" /> <img class="smiley" src="/images/smiley_ohwell.gif" alt="Smiley 'oh well'" /> <img class="smiley" src="/images/smiley_indifferent.gif" alt="Smiley indifferent" /> <img class="smiley" src="/images/smiley_wink_animated.gif" alt="Smiley winking" /></p>
In any inline text[# such as a blockquote, paragraph, table, etc. etc.] you can have footnotes[#note Labeled footnotes also work.]. You can see how they're displayed below[# and as you can see, footnotes are autonumbered if you use a pound sign as the label]:
In any inline text[1] you can have footnotes[note]. You can see how they're displayed below[2]:
Footnotes:
[1]: such as a blockquote, paragraph, table,
etc. etc.
[note]: Labeled footnotes also work.
[2]: and as you can see, footnotes are
autonumbered if you use a pound sign as the label
<p class="st-markup">In any inline text<sup><a id="fnp1" href="#fn1">[1]</a></sup> you can have footnotes<sup><a id="fnpnote" href="#fnnote">[note]</a></sup>. You can see how they're displayed below<sup><a id="fnp2" href="#fn2">[2]</a></sup>:</p> <p class="st-markup"><em style="font-style: normal; text-decoration: underline">Footnotes:</em><br /> <a id="fn1" href="#fnp1">[1]</a>: such as a blockquote, paragraph, table, etc. etc.<br /> <a id="fnnote" href="#fnpnote">[note]</a>: Labeled footnotes also work.<br /> <a id="fn2" href="#fnp2">[2]</a>: and as you can see, footnotes are autonumbered if you use a pound sign as the label<br /> </p>
HTML Code:
?!code:language=html
<html>
<head>
<title>This is the page title</title>
</head>
<body style="margin: 0">
<p>This is a paragraph <br />
with two lines in it</p>
<!-- hey look,
this is a comment! -->
</body>
</html>
?!/code
PHP Code (with automatically generated line numbers!):
?!code:language=php&line_numbers=1
<?php
function markup_code(&$document, $position, $args){
$count = count($document);
if($position < $count){ #if we're not already at the end of the
document
$source = '';
while($position < $count and $document[$position] != '?!/code'){
$source .= $document[$position] . "\n";
$document[$position] = ''; #clear each line as we see it
$position++;
}
if($args['language'] == 'php'){
ob_start();
highlight_string($source);
$source = ob_get_contents();
ob_end_clean();
}
$document[$position] = $source;
$position++;
}
return $position;
}
?>
?!/codeHTML Code:
<html>
<head>
<title>This is the page title</title>
</head>
<body style="margin: 0">
<p>This is a paragraph <br />
with two lines in it</p>
<!-- hey look,
this is a comment! -->
</body>
</html>
PHP Code (with automatically generated line numbers!):
1: <?php
2: function markup_code(&$document, $position, $args){
3: $count = count($document);
4: if($position < $count){ #if we're not already at the end of the document
5: $source = '';
6: while($position < $count and $document[$position] != '?!/code'){
7: $source .= $document[$position] . "\n";
8: $document[$position] = ''; #clear each line as we see it
9: $position++;
10: }
11: if($args['language'] == 'php'){
12: ob_start();
13: highlight_string($source);
14: $source = ob_get_contents();
15: ob_end_clean();
16: }
17: $document[$position] = $source;
18: $position++;
19: }
20: return $position;
21: }
22: ?>
<p class="st-markup">HTML Code:</p>
<code><span style="color: #c00"><<span style="color:
#00c">html</span><span style="color: #060"></span>></span><br />
<span style="color: #c00"><<span style="color: #00c">head</span><span
style="color: #060"></span>></span><br />
<span style="color: #c00"><<span style="color: #00c">title</span><span
style="color:
#060"></span>></span>This is the page title<span
style="color: #c00"><<span style="color: #00c">/title</span><span
style="color: #060"></span>></span><br />
<span style="color: #c00"><<span style="color: #00c">/head</span><span
style="color: #060"></span>></span><br />
<span style="color: #c00"><<span style="color: #00c">body</span><span
style="color:
#060"> style="margin: 0"</span>></span><br />
<span style="color: #c00"><<span style="color: #00c">p</span><span
style="color:
#060"></span>></span>This is a paragraph <span
style="color: #c00"><<span style="color: #00c">br</span><span
style="color: #060"> /</span>></span><br />
with two lines in it<span style="color:
#c00"><<span style="color: #00c">/p</span><span style="color:
#060"></span>></span><br />
<br />
<span style="color: #f90"><!-- hey look,<br />
this is a comment! --></span><br />
<span style="color: #c00"><<span style="color: #00c">/body</span><span
style="color: #060"></span>></span><br />
<span style="color: #c00"><<span style="color: #00c">/html</span><span
style="color: #060"></span>></span><br />
</code>
<p class="st-markup">PHP Code (with automatically generated line
numbers!):</p>
<code><span style="color: #000000">
 1: <span style="color: #0000BB"><?php<br
/> 2</span><span style="color:
#007700">: function </span><span style="color:
#0000BB">markup_code</span><span style="color: #007700">(&</span><span
style="color: #0000BB">$document</span><span style="color:
#007700">, </span><span style="color: #0000BB">$position</span><span
style="color: #007700">, </span><span style="color:
#0000BB">$args</span><span style="color: #007700">){<br
/> </span><span style="color: #0000BB">3</span><span style="color:
#007700">:     </span><span style="color:
#0000BB">$count </span><span style="color:
#007700">= </span><span style="color: #0000BB">count</span><span
style="color: #007700">(</span><span style="color:
#0000BB">$document</span><span style="color: #007700">);<br
/> </span><span style="color: #0000BB">4</span><span style="color:
#007700">:     if(</span><span style="color:
#0000BB">$position </span><span style="color:
#007700">< </span><span style="color: #0000BB">$count</span><span
style="color: #007700">){ </span><span style="color:
#FF8000">#if we're not already at the end of the document<br
/> </span><span style="color: #0000BB">5</span><span style="color:
#007700">:         </span><span
style="color: #0000BB">$source </span><span style="color:
#007700">= </span><span style="color: #DD0000">''</span><span
style="color: #007700">;<br /> </span><span style="color:
#0000BB">6</span><span style="color:
#007700">:         while(</span><span
style="color: #0000BB">$position </span><span style="color:
#007700">< </span><span style="color:
#0000BB">$count </span><span style="color:
#007700">and </span><span style="color:
#0000BB">$document</span><span style="color: #007700">[</span><span
style="color: #0000BB">$position</span><span style="color:
#007700">] != </span><span style="color:
#DD0000">'?!/code'</span><span style="color: #007700">){<br
/> </span><span style="color: #0000BB">7</span><span style="color:
#007700">:             </span><span
style="color: #0000BB">$source </span><span style="color:
#007700">.= </span><span style="color: #0000BB">$document</span><span
style="color: #007700">[</span><span style="color:
#0000BB">$position</span><span style="color:
#007700">] . </span><span style="color:
#DD0000">"\n"</span><span style="color: #007700">;<br /> </span><span
style="color: #0000BB">8</span><span style="color:
#007700">:             </span><span
style="color: #0000BB">$document</span><span style="color:
#007700">[</span><span style="color: #0000BB">$position</span><span
style="color: #007700">] = </span><span style="color:
#DD0000">''</span><span style="color: #007700">; </span><span
style="color:
#FF8000">#clear each line as we see it<br
/> </span><span style="color: #0000BB">9</span><span style="color:
#007700">:             </span><span
style="color: #0000BB">$position</span><span style="color: #007700">++;<br
/></span><span style="color: #0000BB">10</span><span style="color:
#007700">:         }<br
/></span><span style="color: #0000BB">11</span><span style="color:
#007700">:         if(</span><span
style="color: #0000BB">$args</span><span style="color:
#007700">[</span><span style="color: #DD0000">'language'</span><span
style="color: #007700">] == </span><span style="color:
#DD0000">'php'</span><span style="color: #007700">){<br /></span><span
style="color: #0000BB">12</span><span style="color:
#007700">:             </span><span
style="color: #0000BB">ob_start</span><span style="color: #007700">();<br
/></span><span style="color: #0000BB">13</span><span style="color:
#007700">:             </span><span
style="color: #0000BB">highlight_string</span><span style="color:
#007700">(</span><span style="color: #0000BB">$source</span><span
style="color: #007700">);<br /></span><span style="color:
#0000BB">14</span><span style="color:
#007700">:             </span><span
style="color: #0000BB">$source </span><span style="color:
#007700">= </span><span style="color:
#0000BB">ob_get_contents</span><span style="color: #007700">();<br
/></span><span style="color: #0000BB">15</span><span style="color:
#007700">:             </span><span
style="color: #0000BB">ob_end_clean</span><span style="color:
#007700">();<br /></span><span style="color: #0000BB">16</span><span
style="color:
#007700">:         }<br
/></span><span style="color: #0000BB">17</span><span style="color:
#007700">:         </span><span
style="color: #0000BB">$document</span><span style="color:
#007700">[</span><span style="color: #0000BB">$position</span><span
style="color: #007700">] = </span><span style="color:
#0000BB">$source</span><span style="color: #007700">;<br /></span><span
style="color: #0000BB">18</span><span style="color:
#007700">:         </span><span
style="color: #0000BB">$position</span><span style="color: #007700">++;<br
/></span><span style="color: #0000BB">19</span><span style="color:
#007700">:     }<br /></span><span style="color:
#0000BB">20</span><span style="color:
#007700">:     return </span><span
style="color: #0000BB">$position</span><span style="color: #007700">;<br
/></span><span style="color: #0000BB">21</span><span style="color:
#007700">: }<br /></span><span style="color: #0000BB">22</span><span
style="color: #007700">: </span><span style="color: #0000BB">?><br
/></span>
</span>
</code>Finally, the parser allows certain "directives".