2023-06-18 16:40:38 +02:00
<!doctype html>
< meta charset = utf-8 >
< title > markdown.raw()< / title >
< meta name = 'viewport' content = 'width=device-width, initial-scale=1.0' >
< link href = 'markdown.css' rel = 'stylesheet' >
2023-06-18 17:59:46 +02:00
< meta name = "og:title" content = "markdown.raw()" >
< meta name = "og:site_name" content = "markdown.raw()" >
< meta name = "description" content = "CSS style to make HTML look like raw markdown" >
< meta name = "og:description" content = "CSS style to make HTML look like raw markdown" >
< meta name = "og:type" content = "website" >
< meta name = "og:url" content = "https://dym.sh/markdown-raw/" >
< meta name = "og:image" content = "https://dym.sh/markdown-raw/th.png" >
< meta name = "twitter:card" content = "summary_large_image" >
2023-06-18 16:40:38 +02:00
< table cellpadding = 20 cellspacing = 20 width = 100% >
< thead >
< th colspan = 2 >
markdown.raw() –
2023-06-18 17:59:46 +02:00
< br > < br > by < a href = 'https://dym.sh' > Dym Sohin< / a >
2023-10-14 23:28:42 +02:00
< br > < br > code < a href = 'https://source.garden/styles/markdown-raw/' > repo< / a >
2023-06-18 16:40:38 +02:00
< br > < br >
< / th >
< / thead >
< tr >
< td align = left dir = ltr > left-to-right< / th >
< td align = right dir = rtl > right-to-left< / th >
< / tr >
< tr > < td dir = ltr >
< h1 > h1 – < / h1 >
< blockquote >
blockquote
< br > second line
< / blockquote >
< article >
< aside > abbr with a title< / aside >
< abbr title = 'resonance VS avalanche' > CSS< / abbr >
< / article >
< h2 > h2 – < / h2 >
< p > < a href = 'https://just.link' > link< / a > < / p >
< p > < a href = 'https://markdown.md' title = 'site about markdown' > link with a "title" attribute< / a > < / p >
< p > < img src = './img.png' alt = 'this is alt text' width = 24 height = 24 > < / p >
< p > < img src = './img.png' alt = 'alt_text' title = 'img_title' width = 24 height = 24 > < / p >
< h3 > h3 – < / h3 >
< pre > < code > multi_lined( ) {
code;
block;
}< / code > < / pre >
< p > some text around < code > inline code< / code > ; and < code title = 'some title' > inline code< / code > < / p >
< p > < b > bold< / b > < b title = 'some title' > bold< / b > < / p >
< p > < i > italics< / i > < i title = 'some title' > italics< / i > < / p >
< p > < u > uinderlined< / u > < u title = 'some title' > uinderlined< / u > < / p >
< p > < s > striked< / s > < s title = 'some title' > striked< / s > < / p >
< p > < ins > inserted< / ins > < ins title = 'some title' > inserted< / ins > < / p >
< p > < del > deleted< / del > < del title = 'some title' > deleted< / del > < / p >
< h4 > h4 – < / h4 >
< ul >
< li > unordered list item< / li >
< li > another one< / li >
< li > now list iside a list:
< ul >
< li > unordered list item< / li >
< li > another one< / li >
< li > lvl 3:
< ul >
< li > unordered list item< / li >
< li > another one< / li >
< li > just one more< / li >
< / ul >
< / li >
< li > back to lvl 2< / li >
< / ul >
< / li >
< li > back to lvl 1< / li >
< / ul >
< ol >
< li > ordered list item at lvl 1< / li >
< li > many numbers< / li >
< li > many numbers< / li >
< li > many numbers< / li >
< li > many numbers< / li >
< li > many numbers< / li >
< li > many numbers< / li >
< li > many numbers< / li >
< li > another one< / li >
< li > next is lvl 2
< ol >
< li > ordered list inside an ordered list< / li >
< li > many numbers< / li >
< li > many numbers< / li >
< li > many numbers< / li >
< li > many numbers< / li >
< li > many numbers< / li >
< li > many numbers< / li >
< li > many numbers< / li >
< li > many numbers< / li >
< li > many numbers< / li >
< li > next is lvl 3
< ol >
< li > ol_level_3< / li >
< li > many numbers< / li >
< li > many numbers< / li >
< li > many numbers< / li >
< li > many numbers< / li >
< li > many numbers< / li >
< li > many numbers< / li >
< li > many numbers< / li >
< li > many numbers< / li >
< li > many numbers< / li >
< li > many numbers< / li >
< li > too deep?< / li >
< / ol >
< / li >
< li > one back to lvl 2< / li >
< li >
< ol >
< li > lvl 3 w/o introductory text< / li >
< / ol >
< / li >
< / ol >
< / li >
< li > one back to lvl 1< / li >
< li >
< ol >
< li > lvl 2 w/o introductory text< / li >
< / ol >
< / li >
< / ol >
< h5 > h5 – < / h5 >
< article >
< input type = "text" value = "input type text" / >
< / article >
< article >
< input type = "checkbox"
name="chk_1"
id="chk_1"
value="1"
checked
/>
< label for = "chk_1" > checkbox with label [1/2]< / label >
< input type = "checkbox"
name="chk_2"
id="chk_2"
value="1"
/>
< label for = "chk_2" > checkbox with label [2/2]< / label >
< / article >
< article >
< input type = "radio"
name="radio"
id="radio-1"
value="1"
checked
/>
< label for = "radio-1" > radio with label (1/2)< / label >
< input type = "radio"
name="radio"
id="radio-2"
value="2"
/>
< label for = "radio-2" > radio with label (2/2)< / label >
< / article >
< article >
< aside > details and summary< / aside >
< details >
< summary > I have keys but no doors. I have space but no room. You can enter but can’ < / summary >
A keyboard.
< / details >
< / article >
< h6 > h6 – < / h6 >
< article >
< aside > this is aside with a somewhat long paragrath< / aside >
< p > long random text The HTML aside element represents a portion of a document whose content is only indirectly related to the document's main content. Asides are frequently presented as sidebars or call-out boxes.< / p >
< / article >
< article >
< aside > cite< / aside >
< p > some < cite > inline citation< / cite > , not a blockquote< / p >
< / article >
< article >
< aside > data< / aside >
< p >
< data value = "398" > Mini Ketchup< / data > ,
< data value = "399" > Jumbo Ketchup< / data > ,
< data value = "400" > Mega Jumbo Ketchup< / data >
< / p >
< / article >
< article >
< aside > dfn< / aside >
< p > < dfn id = "def-validator" > validator< / dfn > < / p >
< / article >
< article >
< aside > kbd< / aside >
< p > < kbd > Ctrl< / kbd > +< kbd > Shift< / kbd > +< kbd > R< / kbd > < / p >
< / article >
< article >
< aside > mark< / aside >
< p > Several species of < mark > salamander< / mark > inhabit the temperate rainforest of the Pacific Northwest.< / p >
< / article >
< article >
< aside > q< / aside >
< p > < q cite = "https://www.imdb.com/title/tt0062622/quotes/qt0396921" title = 'copypasted from MDN' > I'm sorry, Dave. I'm afraid I can't do that.< / q > < / p >
< / article >
< article >
< aside > ruby & co< / aside >
< p > < ruby > 明日 < rp > (< / rp > < rt > Ashita< / rt > < rp > )< / rp > < / ruby > < / p >
< / article >
< article >
< aside > wbr< / aside >
< p > Fernstraßen< wbr > bau< wbr > privat< wbr > finanzierungs< wbr > gesetz< / p >
< / article >
< article >
< aside > var< / aside >
< p > The volume of a box is < var > l< / var > × < var > w< / var > × < var > h< / var > , where < var > l< / var > represents the length, < var > w< / var > the width and < var > h< / var > the height of the box.< / p >
< / article >
< article >
< aside > hr< / aside >
text above hr
< hr >
text below hr
< / article >
< article >
< aside > sup< / aside >
< p > < var > a< sup > 2< / sup > < / var > + < var > b< sup > 2< / sup > < / var > = < var > c< sup > 2< / sup > < / var > < / p >
< / article >
< article >
< aside > sub< / aside >
< p > Almost every developer's favorite molecule is
C< sub > 8< / sub > H< sub > 10< / sub > N< sub > 4< / sub > O< sub > 2< / sub > , also known as "caffeine."< / p >
< / article >
< / td >
< td dir = rtl >
< h1 > h1 – < / h1 >
< blockquote >
blockquote
< br > second line
< / blockquote >
< article >
< aside > abbr with a title< / aside >
< abbr title = 'resonance VS avalanche' > CSS< / abbr >
< / article >
< h2 > h2 – < / h2 >
< p > < a href = 'https://just.link' > link< / a > < / p >
< p > < a href = 'https://markdown.md' title = 'site about markdown' > link with a "title" attribute< / a > < / p >
< p > < img src = './img.png' alt = 'this is alt text' width = 24 height = 24 > < / p >
< p > < img src = './img.png' alt = 'alt_text' title = 'img_title' width = 24 height = 24 > < / p >
< h3 > h3 – < / h3 >
< pre > < code > multi_lined( ) {
code;
block;
}< / code > < / pre >
< p > some text around < code > inline code< / code > ; and < code title = 'some title' > inline code< / code > < / p >
< p > < b > bold< / b > < b title = 'some title' > bold< / b > < / p >
< p > < i > italics< / i > < i title = 'some title' > italics< / i > < / p >
< p > < u > uinderlined< / u > < u title = 'some title' > uinderlined< / u > < / p >
< p > < s > striked< / s > < s title = 'some title' > striked< / s > < / p >
< p > < ins > inserted< / ins > < ins title = 'some title' > inserted< / ins > < / p >
< p > < del > deleted< / del > < del title = 'some title' > deleted< / del > < / p >
< h4 > h4 – < / h4 >
< ul >
< li > unordered list item< / li >
< li > another one< / li >
< li > now list iside a list:
< ul >
< li > unordered list item< / li >
< li > another one< / li >
< li > lvl 3:
< ul >
< li > unordered list item< / li >
< li > another one< / li >
< li > just one more< / li >
< / ul >
< / li >
< li > back to lvl 2< / li >
< / ul >
< / li >
< li > back to lvl 1< / li >
< / ul >
< ol >
< li > ordered list item at lvl 1< / li >
< li > many numbers< / li >
< li > many numbers< / li >
< li > many numbers< / li >
< li > many numbers< / li >
< li > many numbers< / li >
< li > many numbers< / li >
< li > many numbers< / li >
< li > another one< / li >
< li > next is lvl 2
< ol >
< li > ordered list inside an ordered list< / li >
< li > many numbers< / li >
< li > many numbers< / li >
< li > many numbers< / li >
< li > many numbers< / li >
< li > many numbers< / li >
< li > many numbers< / li >
< li > many numbers< / li >
< li > many numbers< / li >
< li > many numbers< / li >
< li > next is lvl 3
< ol >
< li > ol_level_3< / li >
< li > many numbers< / li >
< li > many numbers< / li >
< li > many numbers< / li >
< li > many numbers< / li >
< li > many numbers< / li >
< li > many numbers< / li >
< li > many numbers< / li >
< li > many numbers< / li >
< li > many numbers< / li >
< li > many numbers< / li >
< li > too deep?< / li >
< / ol >
< / li >
< li > one back to lvl 2< / li >
< li >
< ol >
< li > lvl 3 w/o introductory text< / li >
< / ol >
< / li >
< / ol >
< / li >
< li > one back to lvl 1< / li >
< li >
< ol >
< li > lvl 2 w/o introductory text< / li >
< / ol >
< / li >
< / ol >
< h5 > h5 – < / h5 >
< article >
< input type = "text" value = "input type text" / >
< / article >
< article >
< input type = "checkbox"
name="chk_1_rtl"
id="chk_1_rtl"
value="1"
checked
/>
< label for = "chk_1_rtl" > checkbox with label [1/2]< / label >
< input type = "checkbox"
name="chk_2_rtl"
id="chk_2_rtl"
value="1"
/>
< label for = "chk_2_rtl" > checkbox with label [2/2]< / label >
< / article >
< article >
< input type = "radio"
name="radio_rtl"
id="radio_rtl-1"
value="1"
checked
/>
< label for = "radio_rtl-1" > radio with label (1/2)< / label >
< input type = "radio"
name="radio_rtl"
id="radio_rtl-2"
value="2"
/>
< label for = "radio_rtl-2" > radio with label (2/2)< / label >
< / article >
< article >
< aside > details and summary< / aside >
< details >
< summary > I have keys but no doors. I have space but no room. You can enter but can’ < / summary >
A keyboard.
< / details >
< / article >
< h6 > h6 – < / h6 >
< article >
< aside > this is aside with a somewhat long paragrath< / aside >
< p > long random text The HTML aside element represents a portion of a document whose content is only indirectly related to the document's main content. Asides are frequently presented as sidebars or call-out boxes.< / p >
< / article >
< article >
< aside > cite< / aside >
< p > some < cite > inline citation< / cite > , not a blockquote< / p >
< / article >
< article >
< aside > data< / aside >
< p >
< data value = "398" > Mini Ketchup< / data > ,
< data value = "399" > Jumbo Ketchup< / data > ,
< data value = "400" > Mega Jumbo Ketchup< / data >
< / p >
< / article >
< article >
< aside > dfn< / aside >
< p > < dfn id = "def-validator" > validator< / dfn > < / p >
< / article >
< article >
< aside > kbd< / aside >
< p > < kbd > Ctrl< / kbd > +< kbd > Shift< / kbd > +< kbd > R< / kbd > < / p >
< / article >
< article >
< aside > mark< / aside >
< p > Several species of < mark > salamander< / mark > inhabit the temperate rainforest of the Pacific Northwest.< / p >
< / article >
< article >
< aside > q< / aside >
< p > < q cite = "https://www.imdb.com/title/tt0062622/quotes/qt0396921" title = 'copypasted from MDN' > I'm sorry, Dave. I'm afraid I can't do that.< / q > < / p >
< / article >
< article >
< aside > ruby & co< / aside >
< p > < ruby > 明日 < rp > (< / rp > < rt > Ashita< / rt > < rp > )< / rp > < / ruby > < / p >
< / article >
< article >
< aside > wbr< / aside >
< p > Fernstraßen< wbr > bau< wbr > privat< wbr > finanzierungs< wbr > gesetz< / p >
< / article >
< article >
< aside > var< / aside >
< p > The volume of a box is < var > l< / var > × < var > w< / var > × < var > h< / var > , where < var > l< / var > represents the length, < var > w< / var > the width and < var > h< / var > the height of the box.< / p >
< / article >
< article >
< aside > hr< / aside >
text above hr
< hr >
text below hr
< / article >
< article >
< aside > sup< / aside >
< p > < var > a< sup > 2< / sup > < / var > + < var > b< sup > 2< / sup > < / var > = < var > c< sup > 2< / sup > < / var > < / p >
< / article >
< article >
< aside > sub< / aside >
< p > Almost every developer's favorite molecule is
C< sub > 8< / sub > H< sub > 10< / sub > N< sub > 4< / sub > O< sub > 2< / sub > , also known as "caffeine."< / p >
< / article >
< / table >
