diff options
| author | Shulhan <ms@kilabit.info> | 2022-07-24 19:33:09 +0700 |
|---|---|---|
| committer | Shulhan <ms@kilabit.info> | 2022-07-24 19:34:55 +0700 |
| commit | 4f2549fb0f3f71ca1e1d1f2b3e80a52887dd616b (patch) | |
| tree | 82974904ab601af8eccd59ddaf676990b8ed4fda /testdata/test.got.html | |
| parent | 35bf7c2a9ebaae85a8f7980f2842c328525ee938 (diff) | |
| download | asciidoctor-go-4f2549fb0f3f71ca1e1d1f2b3e80a52887dd616b.tar.xz | |
all: rename the HTML output for test-parser
The HTML output file from asciidoctor is renamed to test.exp.html,
and HTML output file from this library is renamed to test.got.html.
The test.html in testdata is generated from ciigo, when running
"make serve-doc".
Diffstat (limited to 'testdata/test.got.html')
| -rw-r--r-- | testdata/test.got.html | 2963 |
1 files changed, 2963 insertions, 0 deletions
diff --git a/testdata/test.got.html b/testdata/test.got.html new file mode 100644 index 0000000..54bc7b3 --- /dev/null +++ b/testdata/test.got.html @@ -0,0 +1,2963 @@ +<!DOCTYPE html> +<html lang="en"> +<head> +<meta charset="UTF-8"> +<meta http-equiv="X-UA-Compatible" content="IE=edge"> +<meta name="viewport" content="width=device-width, initial-scale=1.0"> +<meta name="generator" content="asciidoctor-go"> +<meta name="description" content="meta description"> +<meta name="keywords" content="key, words"> +<meta name="author" content="Author A, Author mid dle B"> +<title>Example Document title</title> +<style> + +</style> +</head> +<body class="article"> +<div id="header"> +<h1><em>Example <code>Document</code> <strong>title</strong></em></h1> +<div class="details"> +<span id="author" class="author">Author A</span><br> +<span id="email" class="email"><a href="mailto:a@a.com">a@a.com</a></span><br> +<span id="author2" class="author">Author mid dle B</span><br> +<span id="email2" class="email"><a href="mailto:b@b.com">b@b.com</a></span><br> +<span id="revnumber"> 1.1.1,</span> +<span id="revdate">18 July 2020</span> +<br><span id="revremark">remark</span> +</div> +<div id="toc" class="toc"> +<div id="toctitle">Table of Contents</div> +<ul class="sectlevel1"> +<li><a href="#metadata_references">1. Metadata references</a></li> +<li><a href="#inline_formatting_on_section">2. <em>Inline <code>formatting</code> on <strong>section</strong></em></a></li> +<li><a href="#level_1">3. Level 1</a> +<ul class="sectlevel2"> +<li><a href="#level_2">3.1. Level 2</a> +<ul class="sectlevel3"> +<li><a href="#level_3">3.1.1. Level 3</a></li> +</ul> +</li> +</ul> +</li> +<li><a href="#section_two">Section Two</a></li> +<li><a href="#section_three">4. Section Three</a></li> +<li><a href="#comment">5. Comment</a></li> +<li><a href="#paragraph">6. Paragraph</a> +<ul class="sectlevel2"> +<li><a href="#alignment">6.1. Alignment</a></li> +<li><a href="#line_break">6.2. Line break</a></li> +</ul> +</li> +<li><a href="#unconstrained_text_formatting">7. Unconstrained text formatting</a></li> +<li><a href="#single_quote">8. Single quote</a></li> +<li><a href="#subscript_and_superscript">9. Subscript and superscript</a></li> +<li><a href="#constrained_text_formatting">10. Constrained text formatting</a></li> +<li><a href="#blocks">11. Blocks</a> +<ul class="sectlevel2"> +<li><a href="#title">11.1. Title</a></li> +</ul> +</li> +<li><a href="#block_listing">12. Block listing</a></li> +<li><a href="#block_literal">13. Block literal</a></li> +<li><a href="#ordered_lists">14. Ordered Lists</a></li> +<li><a href="#unordered_lists">15. Unordered Lists</a> +<ul class="sectlevel2"> +<li><a href="#custom_markers">15.1. Custom markers</a></li> +<li><a href="#checklist">15.2. Checklist</a></li> +</ul> +</li> +<li><a href="#mixed_list">16. Mixed list</a></li> +<li><a href="#description_list">17. Description list</a></li> +<li><a href="#question_and_answers">18. Question and Answers</a></li> +<li><a href="#table">19. Table</a> +<ul class="sectlevel2"> +<li><a href="#column_formatting">19.1. Column Formatting</a></li> +<li><a href="#cell_formatting">19.2. Cell formatting</a></li> +<li><a href="#header_row">19.3. Header row</a></li> +<li><a href="#footer_row">19.4. Footer row</a></li> +<li><a href="#table_width">19.5. Table width</a></li> +<li><a href="#table_borders">19.6. Table borders</a> +<ul class="sectlevel3"> +<li><a href="#frame">19.6.1. Frame</a></li> +<li><a href="#grids">19.6.2. Grids</a></li> +</ul> +</li> +<li><a href="#striping">19.7. Striping</a></li> +<li><a href="#orientation">19.8. Orientation</a></li> +<li><a href="#table_caption">19.9. Table caption</a></li> +<li><a href="#escaping_the_cell_separator">19.10. Escaping the Cell separator</a></li> +</ul> +</li> +<li><a href="#horizontal_rules">20. Horizontal rules</a></li> +<li><a href="#page_break">21. Page break</a></li> +<li><a href="#urls">22. URLs</a></li> +<li><a href="#anchors">23. Anchors</a> +<ul class="sectlevel2"> +<li><a href="#version-4_9">23.1. Version 4.9</a></li> +<li><a href="#version-4_10">23.2. Version 4.10</a></li> +<li><a href="#which-one">23.3. Version 4.11</a></li> +</ul> +</li> +<li><a href="#cross_references">24. Cross references</a> +<ul class="sectlevel2"> +<li><a href="#internal">24.1. Internal</a></li> +</ul> +</li> +<li><a href="#include">25. Include</a></li> +<li><a href="#images">26. Images</a> +<ul class="sectlevel2"> +<li><a href="#block_images">26.1. Block images</a></li> +<li><a href="#float_group">26.2. Float group</a></li> +<li><a href="#inline_image">26.3. Inline image</a></li> +</ul> +</li> +<li><a href="#block_open">27. Block open</a></li> +<li><a href="#video">28. Video</a></li> +<li><a href="#audio">29. Audio</a></li> +<li><a href="#admonition">30. Admonition</a> +<ul class="sectlevel2"> +<li><a href="#line_admonition">30.1. Line admonition</a></li> +<li><a href="#style_admonition">30.2. Style admonition</a></li> +<li><a href="#icons">30.3. Icons</a></li> +</ul> +</li> +<li><a href="#sidebar">31. Sidebar</a></li> +<li><a href="#example">32. Example</a></li> +<li><a href="#quote">33. Quote</a> +<ul class="sectlevel2"> +<li><a href="#quoted_paragraph">33.1. Quoted paragraph</a></li> +</ul> +</li> +<li><a href="#verse">34. Verse</a></li> +<li><a href="#passthrough">35. Passthrough</a> +<ul class="sectlevel2"> +<li><a href="#block_passthrough">35.1. Block passthrough</a></li> +</ul> +</li> +<li><a href="#section_discrete">36. Section Discrete</a> +<ul class="sectlevel2"> +<li><a href="#after_discrete">36.1. After discrete</a></li> +</ul> +</li> +</ul> + +</div> +</div> +<div id="content"> +<div id="preamble"> +<div class="sectionbody"> +<div class="paragraph"> +<p>This is preamble. +:other metadata:</p> +</div> +<div class="listingblock"> +<div class="content"> +<pre>a</pre> +</div> +</div> +<div class="paragraph"> +<p>==Section must have space</p> +</div> +<div class="literalblock"> +<div class="content"> +<pre>== Indented section</pre> +</div> +</div> +<div class="literalblock"> +<div class="content"> +<pre>:indented-meta:</pre> +</div> +</div> +</div> +</div> +<div class="sect1"> +<h2 id="metadata_references"><a class="anchor" href="#metadata_references"></a><a class="link" href="#metadata_references">1. Metadata references</a></h2> +<div class="sectionbody"> +<div class="paragraph"> +<p>First author: Author A Author A <a href="mailto:a@a.com">a@a.com</a> +AA.</p> +</div> +<div class="paragraph"> +<p>First author: Author A Author A <a href="mailto:a@a.com">a@a.com</a> +AA.</p> +</div> +<div class="paragraph"> +<p>Second author: Author mid dle B Author mid dle B +<a href="mailto:b@b.com">b@b.com</a> AmB.</p> +</div> +<div class="paragraph"> +<p>Revision: 1.1.1, 18 July 2020: remark.</p> +</div> +</div> +</div> +<div class="sect1"> +<h2 id="inline_formatting_on_section"><a class="anchor" href="#inline_formatting_on_section"></a><a class="link" href="#inline_formatting_on_section">2. <em>Inline <code>formatting</code> on <strong>section</strong></em></a></h2> +<div class="sectionbody"> +<div class="paragraph"> +<p>Test inline formatting on section title.</p> +</div> +</div> +</div> +<div class="sect1"> +<h2 id="level_1"><a class="anchor" href="#level_1"></a><a class="link" href="#level_1">3. Level 1</a></h2> +<div class="sectionbody"> +<div class="sect2"> +<h3 id="level_2"><a class="anchor" href="#level_2"></a><a class="link" href="#level_2">3.1. Level 2</a></h3> +<div class="sect3"> +<h4 id="level_3"><a class="anchor" href="#level_3"></a><a class="link" href="#level_3">3.1.1. Level 3</a></h4> +<div class="sect4"> +<h5 id="level_4"><a class="anchor" href="#level_4"></a><a class="link" href="#level_4">Level 4</a></h5> +<div class="sect5"> +<h6 id="level_5"><a class="anchor" href="#level_5"></a><a class="link" href="#level_5">Level 5</a></h6> +</div> +</div> +</div> +</div> +</div> +</div> +<div class="sect1"> +<h2 id="section_two"><a class="anchor" href="#section_two"></a><a class="link" href="#section_two">Section Two</a></h2> +<div class="sectionbody"> +</div> +</div> +<div class="sect1"> +<h2 id="section_three"><a class="anchor" href="#section_three"></a><a class="link" href="#section_three">4. Section Three</a></h2> +<div class="sectionbody"> +</div> +</div> +<div class="sect1"> +<h2 id="comment"><a class="anchor" href="#comment"></a><a class="link" href="#comment">5. Comment</a></h2> +<div class="sectionbody"> +<div class="literalblock"> +<div class="content"> +<pre>//// +Indented block comment +////</pre> +</div> +</div> +</div> +</div> +<div class="sect1"> +<h2 id="paragraph"><a class="anchor" href="#paragraph"></a><a class="link" href="#paragraph">6. Paragraph</a></h2> +<div class="sectionbody"> +<div class="paragraph"> +<div class="title">A Title</div> +<p>Paragraph with title</p> +</div> +<div class="paragraph"> +<p>A paragraph followed by title, +.This is title</p> +</div> +<div class="paragraph"> +<p>A paragraph followed by attribute, +:isthis: attribute</p> +</div> +<div class="paragraph"> +<p>A paragraph followed by literal line, + this is literal line.</p> +</div> +<div class="paragraph"> +<p>A paragraph followed by list, +. This is a ordered list item</p> +</div> +<div class="paragraph"> +<p>A paragraph followed by comment. +This is next line in paragraph.</p> +</div> +<div class="paragraph"> +<p>A paragraph followed by "+",</p> +</div> +<div class="paragraph"> +<p>+ +This is next line in paragraph.</p> +</div> +<div class="paragraph"> +<p>A paragraph followed by listing block</p> +</div> +<div class="listingblock"> +<div class="content"> +<pre>Listing.</pre> +</div> +</div> +<div class="paragraph"> +<p>This is next line in paragraph.</p> +</div> +<div class="paragraph"> +<p>A paragraph followed by section +== This is section name +This is next line in paragraph.</p> +</div> +<div class="paragraph"> +<p>A paragraph followed by literal named</p> +</div> +<div class="literalblock"> +<div class="content"> +<pre>This is literal</pre> +</div> +</div> +<div class="sect2"> +<h3 id="alignment"><a class="anchor" href="#alignment"></a><a class="link" href="#alignment">6.1. Alignment</a></h3> +<div class="paragraph text-left"> +<p>This text is left aligned.</p> +</div> +<div class="paragraph text-right"> +<p>This text is right aligned.</p> +</div> +<div class="paragraph text-center"> +<p>This text is center aligned.</p> +</div> +<div class="paragraph text-justify"> +<p>This text is justify aligned.</p> +</div> +</div> +<div class="sect2"> +<h3 id="line_break"><a class="anchor" href="#line_break"></a><a class="link" href="#line_break">6.2. Line break</a></h3> +<div class="paragraph"> +<p>Rubies are red,<br> +Topazes are blue.</p> +</div> +<div class="ulist"> +<ul> +<li> +<p>is this<br> +line break</p> +</li> +<li> +<p>too<br></p> +</li> +<li> +<p>or not</p> +</li> +</ul> +</div> +</div> +</div> +</div> +<div class="sect1"> +<h2 id="unconstrained_text_formatting"><a class="anchor" href="#unconstrained_text_formatting"></a><a class="link" href="#unconstrained_text_formatting">7. Unconstrained text formatting</a></h2> +<div class="sectionbody"> +<div class="paragraph"> +<p><code>__A *B*__</code>: <em>A <strong>B</strong></em></p> +</div> +<div class="paragraph"> +<p><code>__A `B`__</code>: <em>A <code>B</code></em></p> +</div> +<div class="paragraph"> +<p>__A *B*_: <em>_A <strong>B</strong></em></p> +</div> +<div class="paragraph"> +<p>__A *B*_ C: <em>_A <strong>B</strong></em> C</p> +</div> +<div class="paragraph"> +<p>_A *B*__: <em>A <strong>B</strong>_</em></p> +</div> +<div class="paragraph"> +<p>__A _B_ C__: <em>A <em>B</em> C</em></p> +</div> +<div class="paragraph"> +<p>__A B_ C__: <em>A B_ C</em></p> +</div> +<div class="paragraph"> +<p><code>**A _B_**</code>: <strong>A <em>B</em></strong></p> +</div> +<div class="paragraph"> +<p>**A `B`**: <strong>A <code>B</code></strong></p> +</div> +<div class="paragraph"> +<p>A <code>/<strong></strong>/</code> <strong>B</strong>.</p> +</div> +</div> +</div> +<div class="sect1"> +<h2 id="single_quote"><a class="anchor" href="#single_quote"></a><a class="link" href="#single_quote">8. Single quote</a></h2> +<div class="sectionbody"> +<div class="paragraph"> +<p>'` A single quote without end.</p> +</div> +<div class="paragraph"> +<p>'` A single quote with space ’.</p> +</div> +<div class="paragraph"> +<p>‘A single quote’.</p> +</div> +<div class="paragraph"> +<p>'`A single quote ’.</p> +</div> +</div> +</div> +<div class="sect1"> +<h2 id="subscript_and_superscript"><a class="anchor" href="#subscript_and_superscript"></a><a class="link" href="#subscript_and_superscript">9. Subscript and superscript</a></h2> +<div class="sectionbody"> +<div class="paragraph"> +<p>H<sub>2</sub>0 H~ 3 ~0 H~4 ~0 H ~ 5~0 H~6 7~0.</p> +</div> +<div class="paragraph"> +<p>__Sub<sub>scri__pt</sub>.</p> +</div> +</div> +</div> +<div class="sect1"> +<h2 id="constrained_text_formatting"><a class="anchor" href="#constrained_text_formatting"></a><a class="link" href="#constrained_text_formatting">10. Constrained text formatting</a></h2> +<div class="sectionbody"> +<div class="paragraph"> +<p><code>_A_B</code>: _A_B</p> +</div> +<div class="paragraph"> +<p><code>_A_ B</code>: <em>A</em> B</p> +</div> +<div class="paragraph"> +<p><code>_A _B</code>: _A _B</p> +</div> +<div class="paragraph"> +<p><em>A <code>B</code></em><code> C</code></p> +</div> +<div class="paragraph"> +<p><strong>A <em>B <code>C</code></em><code> D</code> E</strong></p> +</div> +<div class="paragraph"> +<p>Multiple <em>text +“formatting” in <strong>single +paragraph</strong></em>.</p> +</div> +<div class="paragraph"> +<p><em>Inline <a href="https://kilabit.info"><strong>link</strong></a> inside italic</em>.</p> +</div> +<div class="paragraph"> +<p>_Italic without<sup>end</sup>.</p> +</div> +<div class="paragraph"> +<p>"`A double quote without end.</p> +</div> +<div class="paragraph"> +<p><em>A double quote “inside</em> italic”.</p> +</div> +<div class="paragraph"> +<p><em>A <code>monospace between</code></em><code> italic</code>.</p> +</div> +<div class="paragraph"> +<p><strong>bold <em>italic <code>mono end-bold</code></em></strong><em><code> end-italic</code></em><code> end-mono</code>.</p> +</div> +<div class="paragraph"> +<p><strong>bold <em>italic `mono end-bold</em></strong><em> end-italic</em> end-mono.</p> +</div> +<div class="paragraph"> +<p>A bold with * space <strong>, with single non alnum *=</strong>.</p> +</div> +<div class="paragraph"> +<p>"` A double quote with space `".</p> +</div> +</div> +</div> +<div class="sect1"> +<h2 id="blocks"><a class="anchor" href="#blocks"></a><a class="link" href="#blocks">11. Blocks</a></h2> +<div class="sectionbody"> +<div class="sect2"> +<h3 id="title"><a class="anchor" href="#title"></a><a class="link" href="#title">11.1. Title</a></h3> +<div class="ulist"> +<div class="title">TODO list</div> +<ul> +<li> +<p>Learn the AsciiDoc syntax</p> +</li> +<li> +<p>Install Asciidoctor</p> +</li> +<li> +<p>Write my document</p> +</li> +</ul> +</div> +</div> +</div> +</div> +<div class="sect1"> +<h2 id="block_listing"><a class="anchor" href="#block_listing"></a><a class="link" href="#block_listing">12. Block listing</a></h2> +<div class="sectionbody"> +<div class="listingblock"> +<div class="content"> +<pre>This is single paragraph listing.</pre> +</div> +</div> +<div class="paragraph"> +<p>[listing] x +This is not listing.</p> +</div> +<div class="listingblock"> +<div class="content"> +<pre>This is block listing.</pre> +</div> +</div> +</div> +</div> +<div class="sect1"> +<h2 id="block_literal"><a class="anchor" href="#block_literal"></a><a class="link" href="#block_literal">13. Block literal</a></h2> +<div class="sectionbody"> +<div class="literalblock"> +<div class="content"> +<pre>A literal paragraph followed by non-space line: +non-space line.</pre> +</div> +</div> +<div class="literalblock"> +<div class="content"> +<pre>A literal named.</pre> +</div> +</div> +<div class="paragraph"> +<p>[literal] x +A literal named and trailing characters will become paragraph.</p> +</div> +<div class="literalblock"> +<div class="content"> +<pre>With 4 dots.</pre> +</div> +</div> +</div> +</div> +<div class="sect1"> +<h2 id="ordered_lists"><a class="anchor" href="#ordered_lists"></a><a class="link" href="#ordered_lists">14. Ordered Lists</a></h2> +<div class="sectionbody"> +<div class="olist arabic"> +<ol class="arabic"> +<li> +<p>abc +def</p> +</li> +<li> +<p>ghi +jkl</p> +</li> +<li> +<p>Previous line is empty</p> +<div class="paragraph"> +<p>This is a paragraph inside list item.</p> +</div> +<div class="paragraph"> +<p>This is the second paragraph.</p> +</div> +</li> +<li> +<p>Can list have literal paragraph?</p> +<div class="literalblock"> +<div class="content"> +<pre>This is literal paragraph.</pre> +</div> +</div> +<div class="paragraph"> +<p>This is normal paragraph.</p> +</div> +</li> +<li> +<p>Next line is block</p> +</li> +</ol> +</div> +<div class="listingblock"> +<div class="content"> +<pre>This break the list.</pre> +</div> +</div> +<div class="olist arabic"> +<ol class="arabic"> +<li> +<p>This start new list</p> +</li> +</ol> +</div> +<div class="paragraph"> +<p>A new paragraph.</p> +</div> +<div class="olist arabic"> +<ol class="arabic"> +<li> +<p>List item followed by [literal]</p> +<div class="literalblock"> +<div class="content"> +<pre>literal.</pre> +</div> +</div> +</li> +<li> +<p>Second list item</p> +</li> +</ol> +</div> +<div class="paragraph"> +<p>List that not in order</p> +</div> +<div class="olist lowerroman"> +<ol class="lowerroman" type="i"> +<li> +<p>List jumped from three dots,</p> +<div class="olist arabic"> +<ol class="arabic"> +<li> +<p>To one dot</p> +<div class="olist upperalpha"> +<ol class="upperalpha" type="A"> +<li> +<p>To four dots</p> +</li> +</ol> +</div> +</li> +</ol> +</div> +</li> +<li> +<p>And back to three again</p> +<div class="olist loweralpha"> +<ol class="loweralpha" type="a"> +<li> +<p>Can sub-list have title? +.Title</p> +</li> +<li> +<p>Second level</p> +<div class="olist arabic"> +<ol class="arabic"> +<li> +<p>Multiple continuation</p> +</li> +<li> +<p>Second item</p> +<div class="literalblock"> +<div class="content"> +<pre>Is this literal</pre> +</div> +</div> +</li> +<li> +<p>Third item</p> +</li> +</ol> +</div> +</li> +</ol> +</div> +</li> +</ol> +</div> +<div class="paragraph"> +<p>How many dots?</p> +</div> +<div class="olist arabic"> +<ol class="arabic"> +<li> +<p>How</p> +<div class="olist loweralpha"> +<ol class="loweralpha" type="a"> +<li> +<p>Deep</p> +<div class="olist lowerroman"> +<ol class="lowerroman" type="i"> +<li> +<p>Can</p> +<div class="olist upperalpha"> +<ol class="upperalpha" type="A"> +<li> +<p>We</p> +<div class="olist upperroman"> +<ol class="upperroman" type="I"> +<li> +<p>Go</p> +<div class="olist arabic"> +<ol class="arabic"> +<li> +<p>?</p> +<div class="olist arabic"> +<ol class="arabic"> +<li> +<p>Seven</p> +<div class="olist arabic"> +<ol class="arabic"> +<li> +<p>Eight</p> +<div class="olist arabic"> +<ol class="arabic"> +<li> +<p>Nine</p> +<div class="olist arabic"> +<ol class="arabic"> +<li> +<p>Ten</p> +</li> +</ol> +</div> +</li> +</ol> +</div> +</li> +</ol> +</div> +</li> +</ol> +</div> +</li> +</ol> +</div> +</li> +</ol> +</div> +</li> +</ol> +</div> +</li> +</ol> +</div> +</li> +</ol> +</div> +</li> +<li> +<p>List followed by section += New section</p> +</li> +<li> +<p>List and comment. +This line separated by comment.</p> +</li> +<li> +<p>List indented with space</p> +<div class="olist loweralpha"> +<ol class="loweralpha" type="a"> +<li> +<p>Sub 2.1</p> +</li> +<li> +<p>Sub 2.2</p> +</li> +</ol> +</div> +</li> +<li> +<p>List indented with space</p> +</li> +</ol> +</div> +</div> +</div> +<div class="sect1"> +<h2 id="unordered_lists"><a class="anchor" href="#unordered_lists"></a><a class="link" href="#unordered_lists">15. Unordered Lists</a></h2> +<div class="sectionbody"> +<div class="ulist"> +<ul> +<li> +<p>abc +def</p> +</li> +<li> +<p>ghi +jkl</p> +</li> +<li> +<p>Previous line is empty</p> +<div class="paragraph"> +<p>This is a paragraph inside list item.</p> +</div> +<div class="paragraph"> +<p>This is the second paragraph.</p> +</div> +</li> +<li> +<p>Can list have literal paragraph?</p> +<div class="literalblock"> +<div class="content"> +<pre>This is literal paragraph.</pre> +</div> +</div> +<div class="paragraph"> +<p>This is normal paragraph.</p> +</div> +</li> +<li> +<p>Next line is block</p> +</li> +</ul> +</div> +<div class="listingblock"> +<div class="content"> +<pre>This break the list.</pre> +</div> +</div> +<div class="ulist"> +<ul> +<li> +<p>This start new list</p> +</li> +</ul> +</div> +<div class="paragraph"> +<p>A new paragraph.</p> +</div> +<div class="ulist"> +<ul> +<li> +<p>List item followed by [literal]</p> +<div class="literalblock"> +<div class="content"> +<pre>literal.</pre> +</div> +</div> +</li> +<li> +<p>Second list item</p> +</li> +</ul> +</div> +<div class="paragraph"> +<p>List that not in order</p> +</div> +<div class="ulist"> +<ul> +<li> +<p>List jumped from three asterisk,</p> +<div class="ulist"> +<ul> +<li> +<p>To one asterisk</p> +<div class="ulist"> +<ul> +<li> +<p>To four asterisk</p> +</li> +</ul> +</div> +</li> +</ul> +</div> +</li> +<li> +<p>And back to three again</p> +<div class="ulist"> +<ul> +<li> +<p>Can sub-list have title? +.Title</p> +</li> +<li> +<p>Second level</p> +<div class="ulist"> +<ul> +<li> +<p>Multiple continuation</p> +</li> +<li> +<p>Second item</p> +<div class="literalblock"> +<div class="content"> +<pre>Is this literal</pre> +</div> +</div> +</li> +<li> +<p>Third item</p> +</li> +</ul> +</div> +</li> +</ul> +</div> +</li> +</ul> +</div> +<div class="paragraph"> +<p>How deep?</p> +</div> +<div class="ulist"> +<ul> +<li> +<p>How</p> +<div class="ulist"> +<ul> +<li> +<p>Deep</p> +<div class="ulist"> +<ul> +<li> +<p>Can</p> +<div class="ulist"> +<ul> +<li> +<p>We</p> +<div class="ulist"> +<ul> +<li> +<p>Go</p> +<div class="ulist"> +<ul> +<li> +<p>?</p> +<div class="ulist"> +<ul> +<li> +<p>Seven</p> +<div class="ulist"> +<ul> +<li> +<p>Eight</p> +<div class="ulist"> +<ul> +<li> +<p>Nine</p> +<div class="ulist"> +<ul> +<li> +<p>Ten</p> +</li> +</ul> +</div> +</li> +</ul> +</div> +</li> +</ul> +</div> +</li> +</ul> +</div> +</li> +</ul> +</div> +</li> +</ul> +</div> +</li> +</ul> +</div> +</li> +</ul> +</div> +</li> +</ul> +</div> +</li> +<li> +<p>List followed by section += New section</p> +</li> +<li> +<p>List and comment. +This line separated by comment.</p> +</li> +<li> +<p>List indented with space</p> +<div class="ulist"> +<ul> +<li> +<p>Sub 2.1</p> +</li> +<li> +<p>Sub 2.2</p> +</li> +</ul> +</div> +</li> +<li> +<p>List indented with space</p> +</li> +</ul> +</div> +<div class="sect2"> +<h3 id="custom_markers"><a class="anchor" href="#custom_markers"></a><a class="link" href="#custom_markers">15.1. Custom markers</a></h3> +<div class="ulist square"> +<ul class="square"> +<li> +<p>square one</p> +</li> +<li> +<p>square two</p> +</li> +</ul> +</div> +<div class="ulist circle"> +<ul class="circle"> +<li> +<p>circle one</p> +</li> +<li> +<p>circle two</p> +</li> +</ul> +</div> +<div class="ulist disc"> +<ul class="disc"> +<li> +<p>disc one</p> +</li> +<li> +<p>disc two</p> +</li> +</ul> +</div> +<div class="ulist none"> +<ul class="none"> +<li> +<p>none one</p> +</li> +<li> +<p>none two</p> +</li> +</ul> +</div> +<div class="ulist no-bullet"> +<ul class="no-bullet"> +<li> +<p>no bullet one</p> +</li> +<li> +<p>no bullet two</p> +</li> +</ul> +</div> +<div class="ulist unstyled"> +<ul class="unstyled"> +<li> +<p>unstyled one</p> +</li> +<li> +<p>unstyled two</p> +</li> +</ul> +</div> +<div class="ulist what is"> +<ul class="what"> +<li> +<p>what one</p> +</li> +<li> +<p>what two</p> +</li> +</ul> +</div> +</div> +<div class="sect2"> +<h3 id="checklist"><a class="anchor" href="#checklist"></a><a class="link" href="#checklist">15.2. Checklist</a></h3> +<div class="ulist checklist"> +<ul class="checklist"> +<li> +<p>✓ checked</p> +</li> +<li> +<p>✓ also checked</p> +</li> +<li> +<p>❏ not checked</p> +</li> +<li> +<p>normal list item</p> +</li> +</ul> +</div> +</div> +</div> +</div> +<div class="sect1"> +<h2 id="mixed_list"><a class="anchor" href="#mixed_list"></a><a class="link" href="#mixed_list">16. Mixed list</a></h2> +<div class="sectionbody"> +<div class="olist arabic"> +<ol class="arabic"> +<li> +<p>Orderer 1</p> +<div class="ulist"> +<ul> +<li> +<p>Unordered 1</p> +</li> +<li> +<p>Unordered 2</p> +</li> +</ul> +</div> +</li> +<li> +<p>Orderer 1</p> +<div class="olist loweralpha"> +<ol class="loweralpha" type="a"> +<li> +<p>Ordered L2</p> +<div class="ulist"> +<ul> +<li> +<p>Unordered L1</p> +<div class="ulist"> +<ul> +<li> +<p>Unordered L2</p> +</li> +</ul> +</div> +</li> +<li> +<p>Unordered L1</p> +</li> +</ul> +</div> +</li> +</ol> +</div> +</li> +<li> +<p>Ordered L1</p> +<div class="ulist"> +<ul> +<li> +<p>Unordered L1</p> +<div class="ulist"> +<ul> +<li> +<p>Unordered L2</p> +</li> +</ul> +</div> +</li> +<li> +<p>Unordered L1</p> +<div class="olist loweralpha"> +<ol class="loweralpha" type="a"> +<li> +<p>Ordered L2</p> +</li> +</ol> +</div> +</li> +</ul> +</div> +</li> +</ol> +</div> +</div> +</div> +<div class="sect1"> +<h2 id="description_list"><a class="anchor" href="#description_list"></a><a class="link" href="#description_list">17. Description list</a></h2> +<div class="sectionbody"> +<div class="dlist"> +<dl> +<dt class="hdlist1"><code>CPU</code></dt> +<dd> +<p>The brain +of +the +computer.</p> +</dd> +<dt class="hdlist1">Hard drive</dt> +<dd> +<p>Permanent storage for operating system and/or user files.</p> +</dd> +</dl> +</div> +<div class="paragraph"> +<p>With <code>[horizontal]</code> style,</p> +</div> +<div class="hdlist"> +<table> +<tr> +<td class="hdlist1"> +CPU +</td> +<td class="hdlist2"> +<p>The brain of the computer.</p> +</td> +</tr> +<tr> +<td class="hdlist1"> +Hard drive +</td> +<td class="hdlist2"> +<p>Permanent storage for operating system and/or user files.</p> +</td> +</tr> +</table> +</div> +<div class="paragraph"> +<p>With title,</p> +</div> +<div class="dlist"> +<div class="title">A title</div> +<dl> +<dt class="hdlist1">CPU</dt> +<dd> +<p>The brain of the computer.</p> +</dd> +<dt class="hdlist1">Hard drive</dt> +<dd> +<p>Permanent storage for operating system and/or user files.</p> +</dd> +</dl> +</div> +<div class="paragraph"> +<p>Indented with space</p> +</div> +<div class="dlist"> +<dl> +<dt class="hdlist1">CPU</dt> +<dd> +<p>The brain of the computer.</p> +</dd> +<dt class="hdlist1">Hard drive</dt> +<dd> +<p>Permanent storage for operating system and/or user files.</p> +</dd> +</dl> +</div> +<div class="paragraph"> +<p>With continuation "+",</p> +</div> +<div class="dlist"> +<dl> +<dt class="hdlist1">CPU</dt> +<dd> +<div class="paragraph"> +<p>The brain of the computer.</p> +</div> +</dd> +<dt class="hdlist1">Hard drive</dt> +<dd> +<p>Permanent storage for operating system and/or</p> +<div class="paragraph"> +<p>user files.</p> +</div> +</dd> +</dl> +</div> +<div class="paragraph"> +<p>Mixed with list,</p> +</div> +<div class="dlist"> +<dl> +<dt class="hdlist1">Dairy</dt> +<dd> +<div class="ulist"> +<ul> +<li> +<p>Milk</p> +</li> +<li> +<p>Eggs</p> +</li> +</ul> +</div> +</dd> +<dt class="hdlist1">Bakery</dt> +<dd> +<div class="ulist"> +<ul> +<li> +<p>Bread</p> +</li> +</ul> +</div> +</dd> +<dt class="hdlist1">Produce</dt> +<dd> +<div class="ulist"> +<ul> +<li> +<p>Bananas</p> +</li> +</ul> +</div> +</dd> +</dl> +</div> +<div class="paragraph"> +<p>Spread,</p> +</div> +<div class="dlist"> +<dl> +<dt class="hdlist1">Dairy</dt> +<dd> +<div class="ulist"> +<ul> +<li> +<p>Milk</p> +</li> +<li> +<p>Eggs</p> +</li> +</ul> +</div> +</dd> +<dt class="hdlist1">Bakery</dt> +<dd> +<div class="ulist"> +<ul> +<li> +<p>Bread</p> +</li> +</ul> +</div> +</dd> +<dt class="hdlist1">Produce</dt> +<dd> +<div class="ulist"> +<ul> +<li> +<p>Bananas</p> +</li> +</ul> +</div> +</dd> +<dt class="hdlist1">Description</dt> +<dd> +<p>Description body with open block.</p> +<div class="openblock"> +<div class="content"> +<div class="paragraph"> +<p>Paragraph A.</p> +</div> +<div class="ulist"> +<ul> +<li> +<p>List item 1</p> +</li> +<li> +<p>List item 2</p> +</li> +</ul> +</div> +<div class="paragraph"> +<p>Paragraph B.</p> +</div> +<table class="tableblock frame-all grid-all stretch"> +<colgroup> +<col style="width: 33.3333%;"> +<col style="width: 33.3333%;"> +<col style="width: 33.3334%;"> +</colgroup> +<thead> +<tr> +<th class="tableblock halign-left valign-top">Look</th> +<th class="tableblock halign-left valign-top">a</th> +<th class="tableblock halign-left valign-top">table</th> +</tr> +</thead> +<tbody> +<tr> +<td class="tableblock halign-left valign-top"><p class="tableblock">This</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">should</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">work</p></td> +</tr> +</tbody> +</table> +<div class="ulist"> +<ul> +<li> +<p>End with list item</p> +</li> +</ul> +</div> +</div> +</div> +</dd> +</dl> +</div> +<div class="paragraph"> +<p>Mixed with ordered and unordered list,</p> +</div> +<div class="dlist"> +<dl> +<dt class="hdlist1">Operating Systems</dt> +<dd> +<div class="dlist"> +<dl> +<dt class="hdlist1">Linux</dt> +<dd> +<div class="olist arabic"> +<ol class="arabic"> +<li> +<p>Fedora</p> +<div class="ulist"> +<ul> +<li> +<p>Desktop</p> +</li> +</ul> +</div> +</li> +<li> +<p>Ubuntu</p> +<div class="ulist"> +<ul> +<li> +<p>Desktop</p> +</li> +<li> +<p>Server</p> +</li> +</ul> +</div> +</li> +</ol> +</div> +</dd> +<dt class="hdlist1">BSD</dt> +<dd> +<div class="olist arabic"> +<ol class="arabic"> +<li> +<p>FreeBSD</p> +</li> +<li> +<p>NetBSD</p> +</li> +</ol> +</div> +</dd> +</dl> +</div> +</dd> +<dt class="hdlist1">Cloud Providers</dt> +<dd> +<div class="dlist"> +<dl> +<dt class="hdlist1">PaaS</dt> +<dd> +<div class="olist arabic"> +<ol class="arabic"> +<li> +<p>OpenShift</p> +</li> +<li> +<p>CloudBees</p> +</li> +</ol> +</div> +</dd> +<dt class="hdlist1">IaaS</dt> +<dd> +<div class="olist arabic"> +<ol class="arabic"> +<li> +<p>Amazon EC2</p> +</li> +<li> +<p>Rackspace</p> +</li> +</ol> +</div> +</dd> +</dl> +</div> +</dd> +</dl> +</div> +<div class="paragraph"> +<p>With link on label,</p> +</div> +<div class="dlist"> +<dl> +<dt class="hdlist1"><a href="https://pkg.go.dev/git.sr.ht/~shulhan/asciidoctor-go">asciidoctor-go</a></dt> +<dd> +<p>Native asciidoc markup language for Go.</p> +</dd> +</dl> +</div> +</div> +</div> +<div class="sect1"> +<h2 id="question_and_answers"><a class="anchor" href="#question_and_answers"></a><a class="link" href="#question_and_answers">18. Question and Answers</a></h2> +<div class="sectionbody"> +<div class="qlist qanda"> +<ol> +<li> +<p><em>What is Asciidoctor?</em></p> +<p>An implementation of the AsciiDoc processor in Ruby.</p> +</li> +<li> +<p><em>What is the answer to the Ultimate Question?</em></p> +<p>42</p> +</li> +</ol> +</div> +<div class="paragraph"> +<p>A new paragraph.</p> +</div> +</div> +</div> +<div class="sect1"> +<h2 id="table"><a class="anchor" href="#table"></a><a class="link" href="#table">19. Table</a></h2> +<div class="sectionbody"> +<table class="tableblock frame-all grid-all stretch"> +<colgroup> +<col style="width: 50%;"> +<col style="width: 50%;"> +</colgroup> +<thead> +<tr> +<th class="tableblock halign-left valign-top">A</th> +<th class="tableblock halign-left valign-top">B</th> +</tr> +</thead> +<tbody> +<tr> +<td class="tableblock halign-left valign-top"><p class="tableblock">C +D</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">E</p></td> +</tr> +</tbody> +</table> +<div class="paragraph"> +<p>With row columns less than header,</p> +</div> +<table class="tableblock frame-all grid-all stretch"> +<colgroup> +<col style="width: 50%;"> +<col style="width: 50%;"> +</colgroup> +<thead> +<tr> +<th class="tableblock halign-left valign-top">A</th> +<th class="tableblock halign-left valign-top">B</th> +</tr> +</thead> +<tbody> +<tr> +<td class="tableblock halign-left valign-top"><p class="tableblock">C</p> +<p class="tableblock">D</p> +<p class="tableblock">E</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">F</p></td> +</tr> +</tbody> +</table> +<div class="paragraph"> +<p>With row columns greater than header,</p> +</div> +<table class="tableblock frame-all grid-all stretch"> +<colgroup> +<col style="width: 50%;"> +<col style="width: 50%;"> +</colgroup> +<thead> +<tr> +<th class="tableblock halign-left valign-top">A</th> +<th class="tableblock halign-left valign-top">B</th> +</tr> +</thead> +<tbody> +<tr> +<td class="tableblock halign-left valign-top"><p class="tableblock">C</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">D</p></td> +</tr> +</tbody> +</table> +<div class="sect2"> +<h3 id="column_formatting"><a class="anchor" href="#column_formatting"></a><a class="link" href="#column_formatting">19.1. Column Formatting</a></h3> +<table class="tableblock frame-all grid-all stretch"> +<colgroup> +<col style="width: 33.3333%;"> +<col style="width: 33.3333%;"> +<col style="width: 33.3334%;"> +</colgroup> +<tbody> +<tr> +<td class="tableblock halign-left valign-top"><p class="tableblock">Cell in column 1, row 1</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">Cell in column 2, row 1</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">Cell in column 3, row 1</p></td> +</tr> +<tr> +<td class="tableblock halign-left valign-top"><p class="tableblock">Cell in column 1, row 2</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">Cell in column 2, row 2</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">Cell in column 3, row 2</p></td> +</tr> +</tbody> +</table> +<div class="paragraph"> +<p>With horizontal and vertical alignment; and width,</p> +</div> +<table class="tableblock frame-all grid-all stretch"> +<colgroup> +<col style="width: 10%;"> +<col style="width: 30%;"> +<col style="width: 60%;"> +</colgroup> +<tbody> +<tr> +<td class="tableblock halign-left valign-top"><p class="tableblock">Cell in column 1, row 1</p></td> +<td class="tableblock halign-center valign-middle"><p class="tableblock">Cell in column 2, row 1</p></td> +<td class="tableblock halign-right valign-bottom"><p class="tableblock">Cell in column 3, row 1</p></td> +</tr> +<tr> +<td class="tableblock halign-left valign-top"><p class="tableblock">Cell in column 1, row 2</p></td> +<td class="tableblock halign-center valign-middle"><p class="tableblock">Cell in column 2, row 2</p></td> +<td class="tableblock halign-right valign-bottom"><p class="tableblock">Cell in column 3, row 2</p></td> +</tr> +</tbody> +</table> +<div class="paragraph"> +<p>With column styles,</p> +</div> +<table class="tableblock frame-all grid-all stretch"> +<colgroup> +<col style="width: 12.5%;"> +<col style="width: 12.5%;"> +<col style="width: 12.5%;"> +<col style="width: 12.5%;"> +<col style="width: 12.5%;"> +<col style="width: 12.5%;"> +<col style="width: 12.5%;"> +<col style="width: 12.5%;"> +</colgroup> +<thead> +<tr> +<th class="tableblock halign-left valign-top">Asciidoc</th> +<th class="tableblock halign-left valign-top"><code>emphasis</code></th> +<th class="tableblock halign-left valign-top">header</th> +<th class="tableblock halign-left valign-top">literal</th> +<th class="tableblock halign-left valign-top">mono</th> +<th class="tableblock halign-left valign-top">default</th> +<th class="tableblock halign-left valign-top">strong</th> +<th class="tableblock halign-left valign-top">verse</th> +</tr> +</thead> +<tbody> +<tr> +<td class="tableblock halign-left valign-top"> +<div id="content"> +<div class="paragraph"> +<p>Asciidoc</p> +</div> +</div></td> +<td class="tableblock halign-left valign-top"><p class="tableblock"><em>emphasis</em></p></td> +<th class="tableblock halign-left valign-top"><p class="tableblock">header</p></th> +<td class="tableblock halign-left valign-top"><div class="literal"><pre> literal </pre></div></td> +<td class="tableblock halign-left valign-top"><p class="tableblock"><code>mono</code></p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">default</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock"><strong>strong</strong></p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">verse</p></td> +</tr> +</tbody> +</table> +</div> +<div class="sect2"> +<h3 id="cell_formatting"><a class="anchor" href="#cell_formatting"></a><a class="link" href="#cell_formatting">19.2. Cell formatting</a></h3> +<div class="paragraph"> +<p>Cell duplicated across three columns,</p> +</div> +<table class="tableblock frame-all grid-all stretch"> +<colgroup> +<col style="width: 33.3333%;"> +<col style="width: 33.3333%;"> +<col style="width: 33.3334%;"> +</colgroup> +<tbody> +<tr> +<td class="tableblock halign-left valign-top"><p class="tableblock">A1</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">B1</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">C1</p></td> +</tr> +<tr> +<td class="tableblock halign-left valign-top"><p class="tableblock">A2-B2-C2</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">A2-B2-C2</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">A2-B2-C2</p></td> +</tr> +<tr> +<td class="tableblock halign-left valign-top"><p class="tableblock">A3</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">B3</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">C3</p></td> +</tr> +</tbody> +</table> +<div class="paragraph"> +<p>Cell spanning three columns,</p> +</div> +<table class="tableblock frame-all grid-all stretch"> +<colgroup> +<col style="width: 33.3333%;"> +<col style="width: 33.3333%;"> +<col style="width: 33.3334%;"> +</colgroup> +<tbody> +<tr> +<td class="tableblock halign-left valign-top"><p class="tableblock">A1</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">B1</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">C1</p></td> +</tr> +<tr> +<td class="tableblock halign-left valign-top" colspan="3"><p class="tableblock">A2…​C2</p></td> +</tr> +<tr> +<td class="tableblock halign-left valign-top"><p class="tableblock">A3</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">B3</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">C3</p></td> +</tr> +</tbody> +</table> +</div> +<div class="sect2"> +<h3 id="header_row"><a class="anchor" href="#header_row"></a><a class="link" href="#header_row">19.3. Header row</a></h3> +<table class="tableblock frame-all grid-all stretch"> +<colgroup> +<col style="width: 50%;"> +<col style="width: 50%;"> +</colgroup> +<thead> +<tr> +<th class="tableblock halign-left valign-top">A1</th> +<th class="tableblock halign-left valign-top">B1</th> +</tr> +</thead> +<tbody> +<tr> +<td class="tableblock halign-left valign-top"><p class="tableblock">A2</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">B2</p></td> +</tr> +</tbody> +</table> +<table class="tableblock frame-all grid-all stretch"> +<colgroup> +<col style="width: 50%;"> +<col style="width: 50%;"> +</colgroup> +<tbody> +<tr> +<td class="tableblock halign-left valign-top"><p class="tableblock">A1: noheader</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">B1</p></td> +</tr> +<tr> +<td class="tableblock halign-left valign-top"><p class="tableblock">A2</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">B2</p></td> +</tr> +</tbody> +</table> +</div> +<div class="sect2"> +<h3 id="footer_row"><a class="anchor" href="#footer_row"></a><a class="link" href="#footer_row">19.4. Footer row</a></h3> +<table class="tableblock frame-all grid-all stretch"> +<colgroup> +<col style="width: 50%;"> +<col style="width: 50%;"> +</colgroup> +<thead> +<tr> +<th class="tableblock halign-left valign-top">A1</th> +<th class="tableblock halign-left valign-top">B1</th> +</tr> +</thead> +<tfoot> +<tr> +<td class="tableblock halign-left valign-top"><p class="tableblock">A2</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">B2</p></td> +</tr> +</tfoot> +</table> +<table class="tableblock frame-all grid-all stretch"> +<colgroup> +<col style="width: 50%;"> +<col style="width: 50%;"> +</colgroup> +<thead> +<tr> +<th class="tableblock halign-left valign-top">A1</th> +<th class="tableblock halign-left valign-top">B1</th> +</tr> +</thead> +</table> +</div> +<div class="sect2"> +<h3 id="table_width"><a class="anchor" href="#table_width"></a><a class="link" href="#table_width">19.5. Table width</a></h3> +<table class="tableblock frame-all grid-all" style="width: 75%;"> +<colgroup> +<col style="width: 50%;"> +<col style="width: 50%;"> +</colgroup> +<thead> +<tr> +<th class="tableblock halign-left valign-top">A1</th> +<th class="tableblock halign-left valign-top">B1</th> +</tr> +</thead> +<tbody> +<tr> +<td class="tableblock halign-left valign-top"><p class="tableblock">A2</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">B2</p></td> +</tr> +</tbody> +</table> +<div class="paragraph"> +<p>Table with autowidth,</p> +</div> +<table class="tableblock frame-all grid-all fit-content"> +<colgroup> +<col> +<col> +</colgroup> +<thead> +<tr> +<th class="tableblock halign-left valign-top">auto</th> +<th class="tableblock halign-left valign-top">width</th> +</tr> +</thead> +<tbody> +<tr> +<td class="tableblock halign-left valign-top"><p class="tableblock">Cell in column 1, row 2</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">Cell in column 2, row 2</p></td> +</tr> +</tbody> +</table> +<table class="tableblock frame-all grid-all fit-content stretch"> +<colgroup> +<col> +<col> +<col> +</colgroup> +<thead> +<tr> +<th class="tableblock halign-left valign-top">Name of Column 1</th> +<th class="tableblock halign-left valign-top">Name of Column 2</th> +<th class="tableblock halign-left valign-top">Name of Column 3</th> +</tr> +</thead> +<tbody> +<tr> +<td class="tableblock halign-left valign-top"><p class="tableblock">Cell in column 1, row 1</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">Cell in column 2, row 1</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">Cell in column 3, row 1</p></td> +</tr> +</tbody> +</table> +<table class="tableblock frame-all grid-all stretch"> +<colgroup> +<col style="width: 25%;"> +<col> +<col> +</colgroup> +<tbody> +<tr> +<th class="tableblock halign-left valign-top"><p class="tableblock">small</p></th> +<td class="tableblock halign-left valign-top"><p class="tableblock">as big as the column needs to be</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">the rest</p></td> +</tr> +</tbody> +</table> +</div> +<div class="sect2"> +<h3 id="table_borders"><a class="anchor" href="#table_borders"></a><a class="link" href="#table_borders">19.6. Table borders</a></h3> +<div class="sect3"> +<h4 id="frame"><a class="anchor" href="#frame"></a><a class="link" href="#frame">19.6.1. Frame</a></h4> +<table class="tableblock frame-ends grid-all stretch"> +<colgroup> +<col style="width: 33.3333%;"> +<col style="width: 33.3333%;"> +<col style="width: 33.3334%;"> +</colgroup> +<thead> +<tr> +<th class="tableblock halign-left valign-top">A1</th> +<th class="tableblock halign-left valign-top">B1</th> +<th class="tableblock halign-left valign-top">C1</th> +</tr> +</thead> +<tbody> +<tr> +<td class="tableblock halign-left valign-top"><p class="tableblock">A2</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">B2</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">C2</p></td> +</tr> +</tbody> +</table> +<table class="tableblock frame-sides grid-all stretch"> +<colgroup> +<col style="width: 33.3333%;"> +<col style="width: 33.3333%;"> +<col style="width: 33.3334%;"> +</colgroup> +<thead> +<tr> +<th class="tableblock halign-left valign-top">A1</th> +<th class="tableblock halign-left valign-top">B1</th> +<th class="tableblock halign-left valign-top">C1</th> +</tr> +</thead> +<tbody> +<tr> +<td class="tableblock halign-left valign-top"><p class="tableblock">A2</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">B2</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">C2</p></td> +</tr> +</tbody> +</table> +<table class="tableblock frame-none grid-all stretch"> +<colgroup> +<col style="width: 33.3333%;"> +<col style="width: 33.3333%;"> +<col style="width: 33.3334%;"> +</colgroup> +<thead> +<tr> +<th class="tableblock halign-left valign-top">A1</th> +<th class="tableblock halign-left valign-top">B1</th> +<th class="tableblock halign-left valign-top">C1</th> +</tr> +</thead> +<tbody> +<tr> +<td class="tableblock halign-left valign-top"><p class="tableblock">A2</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">B2</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">C2</p></td> +</tr> +</tbody> +</table> +</div> +<div class="sect3"> +<h4 id="grids"><a class="anchor" href="#grids"></a><a class="link" href="#grids">19.6.2. Grids</a></h4> +<table class="tableblock frame-all grid-rows stretch"> +<colgroup> +<col style="width: 33.3333%;"> +<col style="width: 33.3333%;"> +<col style="width: 33.3334%;"> +</colgroup> +<thead> +<tr> +<th class="tableblock halign-left valign-top">A1</th> +<th class="tableblock halign-left valign-top">B1</th> +<th class="tableblock halign-left valign-top">C1</th> +</tr> +</thead> +<tbody> +<tr> +<td class="tableblock halign-left valign-top"><p class="tableblock">A2</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">B2</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">C2</p></td> +</tr> +</tbody> +</table> +<table class="tableblock frame-all grid-cols stretch"> +<colgroup> +<col style="width: 33.3333%;"> +<col style="width: 33.3333%;"> +<col style="width: 33.3334%;"> +</colgroup> +<thead> +<tr> +<th class="tableblock halign-left valign-top">A1</th> +<th class="tableblock halign-left valign-top">B1</th> +<th class="tableblock halign-left valign-top">C1</th> +</tr> +</thead> +<tbody> +<tr> +<td class="tableblock halign-left valign-top"><p class="tableblock">A2</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">B2</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">C2</p></td> +</tr> +</tbody> +</table> +<table class="tableblock frame-all grid-none stretch"> +<colgroup> +<col style="width: 33.3333%;"> +<col style="width: 33.3333%;"> +<col style="width: 33.3334%;"> +</colgroup> +<thead> +<tr> +<th class="tableblock halign-left valign-top">A1</th> +<th class="tableblock halign-left valign-top">B1</th> +<th class="tableblock halign-left valign-top">C1</th> +</tr> +</thead> +<tbody> +<tr> +<td class="tableblock halign-left valign-top"><p class="tableblock">A2</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">B2</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">C2</p></td> +</tr> +</tbody> +</table> +</div> +</div> +<div class="sect2"> +<h3 id="striping"><a class="anchor" href="#striping"></a><a class="link" href="#striping">19.7. Striping</a></h3> +<table class="tableblock frame-all grid-all stripes-even stretch"> +<colgroup> +<col style="width: 33.3333%;"> +<col style="width: 33.3333%;"> +<col style="width: 33.3334%;"> +</colgroup> +<thead> +<tr> +<th class="tableblock halign-left valign-top">A1</th> +<th class="tableblock halign-left valign-top">B1</th> +<th class="tableblock halign-left valign-top">C1</th> +</tr> +</thead> +<tbody> +<tr> +<td class="tableblock halign-left valign-top"><p class="tableblock">A2</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">B2</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">C2</p></td> +</tr> +<tr> +<td class="tableblock halign-left valign-top"><p class="tableblock">A3</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">B3</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">C3</p></td> +</tr> +</tbody> +</table> +<table class="tableblock frame-all grid-all stripes-odd stretch"> +<colgroup> +<col style="width: 33.3333%;"> +<col style="width: 33.3333%;"> +<col style="width: 33.3334%;"> +</colgroup> +<thead> +<tr> +<th class="tableblock halign-left valign-top">A1</th> +<th class="tableblock halign-left valign-top">B1</th> +<th class="tableblock halign-left valign-top">C1</th> +</tr> +</thead> +<tbody> +<tr> +<td class="tableblock halign-left valign-top"><p class="tableblock">A2</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">B2</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">C2</p></td> +</tr> +<tr> +<td class="tableblock halign-left valign-top"><p class="tableblock">A3</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">B3</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">C3</p></td> +</tr> +</tbody> +</table> +<table class="tableblock frame-all grid-all stripes-all stretch"> +<colgroup> +<col style="width: 33.3333%;"> +<col style="width: 33.3333%;"> +<col style="width: 33.3334%;"> +</colgroup> +<thead> +<tr> +<th class="tableblock halign-left valign-top">A1</th> +<th class="tableblock halign-left valign-top">B1</th> +<th class="tableblock halign-left valign-top">C1</th> +</tr> +</thead> +<tbody> +<tr> +<td class="tableblock halign-left valign-top"><p class="tableblock">A2</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">B2</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">C2</p></td> +</tr> +<tr> +<td class="tableblock halign-left valign-top"><p class="tableblock">A3</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">B3</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">C3</p></td> +</tr> +</tbody> +</table> +<table class="tableblock frame-all grid-all stripes-hover stretch"> +<colgroup> +<col style="width: 33.3333%;"> +<col style="width: 33.3333%;"> +<col style="width: 33.3334%;"> +</colgroup> +<thead> +<tr> +<th class="tableblock halign-left valign-top">A1</th> +<th class="tableblock halign-left valign-top">B1</th> +<th class="tableblock halign-left valign-top">C1</th> +</tr> +</thead> +<tbody> +<tr> +<td class="tableblock halign-left valign-top"><p class="tableblock">A2</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">B2</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">C2</p></td> +</tr> +<tr> +<td class="tableblock halign-left valign-top"><p class="tableblock">A3</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">B3</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">C3</p></td> +</tr> +</tbody> +</table> +</div> +<div class="sect2"> +<h3 id="orientation"><a class="anchor" href="#orientation"></a><a class="link" href="#orientation">19.8. Orientation</a></h3> +<table class="tableblock frame-all grid-all stretch"> +<colgroup> +<col style="width: 50%;"> +<col style="width: 50%;"> +</colgroup> +<tbody> +<tr> +<td class="tableblock halign-left valign-top"><p class="tableblock">a</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">b</p></td> +</tr> +<tr> +<td class="tableblock halign-left valign-top"><p class="tableblock">c</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">d</p></td> +</tr> +</tbody> +</table> +<table class="tableblock frame-all grid-all stretch"> +<colgroup> +<col style="width: 50%;"> +<col style="width: 50%;"> +</colgroup> +<tbody> +<tr> +<td class="tableblock halign-left valign-top"><p class="tableblock">a</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">b</p></td> +</tr> +<tr> +<td class="tableblock halign-left valign-top"><p class="tableblock">c</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">d</p></td> +</tr> +</tbody> +</table> +</div> +<div class="sect2"> +<h3 id="table_caption"><a class="anchor" href="#table_caption"></a><a class="link" href="#table_caption">19.9. Table caption</a></h3> +<table class="tableblock frame-all grid-all stretch"> +<caption class="title">Table 1. A formal table</caption> +<colgroup> +<col style="width: 50%;"> +<col style="width: 50%;"> +</colgroup> +<thead> +<tr> +<th class="tableblock halign-left valign-top">Name of Column 1</th> +<th class="tableblock halign-left valign-top">Name of Column 2</th> +</tr> +</thead> +<tbody> +<tr> +<td class="tableblock halign-left valign-top"><p class="tableblock">Cell in column 1, row 1</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">Cell in column 2, row 1</p></td> +</tr> +</tbody> +</table> +<table class="tableblock frame-all grid-all stretch"> +<caption class="title">Table A. A formal table</caption> +<colgroup> +<col style="width: 50%;"> +<col style="width: 50%;"> +</colgroup> +<thead> +<tr> +<th class="tableblock halign-left valign-top">Name of Column 1</th> +<th class="tableblock halign-left valign-top">Name of Column 2</th> +</tr> +</thead> +<tbody> +<tr> +<td class="tableblock halign-left valign-top"><p class="tableblock">Cell in column 1, row 1</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">Cell in column 2, row 1</p></td> +</tr> +</tbody> +</table> +<table class="tableblock frame-all grid-all stretch"> +<caption class="title"> A formal table</caption> +<colgroup> +<col style="width: 50%;"> +<col style="width: 50%;"> +</colgroup> +<thead> +<tr> +<th class="tableblock halign-left valign-top">Name of Column 1</th> +<th class="tableblock halign-left valign-top">Name of Column 2</th> +</tr> +</thead> +<tbody> +<tr> +<td class="tableblock halign-left valign-top"><p class="tableblock">Cell in column 1, row 1</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">Cell in column 2, row 1</p></td> +</tr> +</tbody> +</table> +</div> +<div class="sect2"> +<h3 id="escaping_the_cell_separator"><a class="anchor" href="#escaping_the_cell_separator"></a><a class="link" href="#escaping_the_cell_separator">19.10. Escaping the Cell separator</a></h3> +<table class="tableblock frame-all grid-all stretch"> +<colgroup> +<col style="width: 50%;"> +<col style="width: 50%;"> +</colgroup> +<tbody> +<tr> +<td class="tableblock halign-left valign-top"><p class="tableblock">The default separator in PSV tables is the | character.</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">The | character is often referred to as a “pipe”.</p></td> +</tr> +</tbody> +</table> +<table class="tableblock frame-all grid-all stretch"> +<colgroup> +<col style="width: 50%;"> +<col style="width: 50%;"> +</colgroup> +<tbody> +<tr> +<td class="tableblock halign-left valign-top"><p class="tableblock">The default separator in PSV tables is the | character.</p></td> +<td class="tableblock halign-left valign-top"><p class="tableblock">The | character is often referred to as a “pipe”.</p></td> +</tr> +</tbody> +</table> +</div> +</div> +</div> +<div class="sect1"> +<h2 id="horizontal_rules"><a class="anchor" href="#horizontal_rules"></a><a class="link" href="#horizontal_rules">20. Horizontal rules</a></h2> +<div class="sectionbody"> +<hr> +<div class="paragraph"> +<p>A paragraph followed by horizontal rule, +--- +- - - +<strong>*</strong> +* * *</p> +</div> +<div class="paragraph"> +<p>With leading spaces,</p> +</div> +<div class="literalblock"> +<div class="content"> +<pre>''' +---</pre> +</div> +</div> +</div> +</div> +<div class="sect1"> +<h2 id="page_break"><a class="anchor" href="#page_break"></a><a class="link" href="#page_break">21. Page break</a></h2> +<div class="sectionbody"> +<div class="paragraph"> +<p>Before page break.</p> +</div> +<div style="page-break-after: always;"></div> +<div class="paragraph"> +<p>After page break.</p> +</div> +</div> +</div> +<div class="sect1"> +<h2 id="urls"><a class="anchor" href="#urls"></a><a class="link" href="#urls">22. URLs</a></h2> +<div class="sectionbody"> +<div class="paragraph"> +<p><a href="https://asciidoctor.org" class="bare">https://asciidoctor.org</a>.</p> +</div> +<div class="paragraph"> +<p><a href="https://asciidoctor.org" class="a b" target="_blank" rel="noopener">Asciidoctor</a>.</p> +</div> +<div class="paragraph"> +<p><a href="https://kilabit.info" target="_blank" rel="noopener">Kilabit</a>.</p> +</div> +<div class="paragraph"> +<p>https://example.org.</p> +</div> +<div class="paragraph"> +<p><a href="irc://irc.freenode.org/#fedora">Fedora IRC channel</a>.</p> +</div> +<div class="paragraph"> +<p><a href="mailto:ms@kilabit.info">mailto:ms@kilabit.info</a>.</p> +</div> +<div class="paragraph"> +<p><a href="mailto:ms@kilabit.info">Mail to me</a>.</p> +</div> +<div class="paragraph"> +<p>Relative file <a href="test.html">test.html</a>.</p> +</div> +</div> +</div> +<div class="sect1"> +<h2 id="anchors"><a class="anchor" href="#anchors"></a><a class="link" href="#anchors">23. Anchors</a></h2> +<div class="sectionbody"> +<div id="notice" class="paragraph"> +<p>This paragraph gets a lot of attention.</p> +</div> +<div id="notice_2" class="paragraph"> +<p>This paragraph gets a lot of attention.</p> +</div> +<div class="paragraph"> +<p><a id="bookmark-a"></a>Inline anchors make arbitrary content referenceable.</p> +</div> +<div class="paragraph"> +<p><span id="bookmark-b">Inline <em>anchors</em> can be applied to a phrase like this one.</span></p> +</div> +<div class="ulist"> +<ul> +<li> +<p>First item</p> +</li> +<li> +<p><a id="step2"></a>Second item</p> +</li> +<li> +<p>Third item</p> +</li> +</ul> +</div> +<div class="sect2"> +<h3 id="version-4_9"><a class="anchor" href="#version-4_9"></a><a class="link" href="#version-4_9">23.1. Version 4.9</a></h3> +</div> +<div class="sect2"> +<h3 id="version-4_10"><a class="anchor" href="#version-4_10"></a><a class="link" href="#version-4_10">23.2. <a id="current"></a>Version 4.10</a></h3> +</div> +<div class="sect2"> +<h3 id="which-one"><a class="anchor" href="#which-one"></a><a class="link" href="#which-one">23.3. Version 4.11<a id="version-4_11"></a></a></h3> +</div> +</div> +</div> +<div class="sect1"> +<h2 id="cross_references"><a class="anchor" href="#cross_references"></a><a class="link" href="#cross_references">24. Cross references</a></h2> +<div class="sectionbody"> +<div class="sect2"> +<h3 id="internal"><a class="anchor" href="#internal"></a><a class="link" href="#internal">24.1. Internal</a></h3> +<div class="paragraph"> +<p>Cross reference with ID <a href="#_anchors">_anchors</a>.</p> +</div> +<div class="paragraph"> +<p>Cross reference with block title <a href="#anchors">This is anchor</a>.</p> +</div> +<div class="paragraph"> +<p>Cross reference with reftext <a href="#anchors">This is anchor</a>.</p> +</div> +<div class="paragraph"> +<p>Cross reference with custom label <a href="#_anchors">custom anchor label</a>.</p> +</div> +</div> +</div> +</div> +<div class="sect1"> +<h2 id="include"><a class="anchor" href="#include"></a><a class="link" href="#include">25. Include</a></h2> +<div class="sectionbody"> +<div class="paragraph"> +<p>This is inside the fragment1.adoc.</p> +</div> +<div class="listingblock"> +<div class="content"> +<pre class="highlight"><code class="language-go" data-lang="go">// SPDX-FileCopyrightText: 2020 M. Shulhan <ms@kilabit.info> +// SPDX-License-Identifier: GPL-3.0-or-later + +package asciidoctor + +// anchor contains label and counter for duplicate ID. +type anchor struct { + label string + counter int +}</code></pre> +</div> +</div> +</div> +</div> +<div class="sect1"> +<h2 id="images"><a class="anchor" href="#images"></a><a class="link" href="#images">26. Images</a></h2> +<div class="sectionbody"> +<div class="sect2"> +<h3 id="block_images"><a class="anchor" href="#block_images"></a><a class="link" href="#block_images">26.1. Block images</a></h3> +<div class="imageblock"> +<div class="content"> +<img src="sunset.jpg" alt="sunset"> +</div> +</div> +<div class="imageblock"> +<div class="content"> +<img src="sunset.jpg" alt="Block image with attribute ref"> +</div> +</div> +<div class="paragraph"> +<p>image::sunset.jpg[ +This is become paragraph.</p> +</div> +<div class="paragraph"> +<p>image::sunset.jpg]</p> +</div> +<div class="imageblock"> +<div class="content"> +<img src="sunset.jpg" alt="1"> +</div> +</div> +<div class="imageblock"> +<div class="content"> +<img src="sunset.jpg" alt="1"> +</div> +</div> +<div class="imageblock"> +<div class="content"> +<img src="notexist.jpg" alt="notexist"> +</div> +</div> +<div class="imageblock"> +<div class="content"> +<img src="https://upload.wikimedia.org/wikipedia/commons/3/35/Tux.svg" alt="Tux" width="250" height="350"> +</div> +</div> +<div class="imageblock right text-center"> +<div class="content"> +<img src="sunset.png" alt="Tiger1" width="100" height="100"> +</div> +</div> +<div class="imageblock righx"> +<div class="content"> +<img src="sunset.png" alt="Tiger2" width="100" height="100"> +</div> +</div> +<div class="imageblock"> +<div class="content"> +<img src="sunset.png" alt="Tiger3" width="100" height="100"> +</div> +</div> +<div class="imageblock right"> +<div class="content"> +<img src="sunset.png" alt="Tiger4" width="100" height="100"> +</div> +</div> +<div class="imageblock righx"> +<div class="content"> +<img src="sunset.png" alt="Tiger5" width="100" height="100"> +</div> +</div> +<div class="imageblock right left"> +<div class="content"> +<img src="sunset.png" alt="Tiger6" width="100" height="100"> +</div> +</div> +<div class="imageblock right text-center"> +<div class="content"> +<img src="sunset.png" alt="Tiger7" width="100" height="100"> +</div> +</div> +<div class="imageblock righx center"> +<div class="content"> +<img src="sunset.png" alt="Tiger8" width="100" height="100"> +</div> +</div> +</div> +<div class="sect2"> +<h3 id="float_group"><a class="anchor" href="#float_group"></a><a class="link" href="#float_group">26.2. Float group</a></h3> +<div class="openblock float-group"> +<div class="content"> +<div class="imageblock left"> +<div class="content"> +<img src="a.png" alt="A" width="240" height="180"> +</div> +<div class="title">Figure 1. Image A</div> +</div> +<div class="imageblock left"> +<div class="content"> +<img src="b.png" alt="B" width="240" height="180"> +</div> +<div class="title">Figure 2. Image B</div> +</div> +</div> +</div> +<div class="paragraph"> +<p>Text below images.</p> +</div> +</div> +<div class="sect2"> +<h3 id="inline_image"><a class="anchor" href="#inline_image"></a><a class="link" href="#inline_image">26.3. Inline image</a></h3> +<div class="paragraph"> +<p><span class="image"><img src="https://upload.wikimedia.org/wikipedia/commons/3/35/Tux.svg" alt="Linux" width="25" height="35"></span></p> +</div> +<div class="paragraph"> +<p><span class="image right"><img src="linux.png" alt="Linux" width="150" height="150"></span> +You can find Linux everywhere these days!</p> +</div> +<div class="paragraph"> +<p><span class="image right"><img src="sunset.jpg" alt="Sunset" width="150" height="150"></span> What a beautiful sunset!</p> +</div> +<div class="paragraph"> +<p>Image with link <span class="image"><a class="image" href="https://kilabit.info"><img src="sunset.jpg" alt="Sunset"></a></span>.</p> +</div> +</div> +</div> +</div> +<div class="sect1"> +<h2 id="block_open"><a class="anchor" href="#block_open"></a><a class="link" href="#block_open">27. Block open</a></h2> +<div class="sectionbody"> +<div class="openblock"> +<div class="title">Section inside</div> +<div class="content"> +<div class="paragraph"> +<p>== Section</p> +</div> +</div> +</div> +</div> +</div> +<div class="sect1"> +<h2 id="video"><a class="anchor" href="#video"></a><a class="link" href="#video">28. Video</a></h2> +<div class="sectionbody"> +<div class="videoblock"> +<div class="title">Video without options</div> +<div class="content"> +<video src="video_file.mp4#t=60,140" width="640" height="320" poster="sunset.jpg" controls> +Your browser does not support the video tag. +</video> +</div> +</div> +<div class="videoblock"> +<div class="title">Video with nocontrols, nofullscreen</div> +<div class="content"> +<video src="video_file.mp4#t=60,140" width="640" height="320" poster="sunset.jpg" loop> +Your browser does not support the video tag. +</video> +</div> +</div> +<div class="videoblock"> +<div class="title">Youtube default options</div> +<div class="content"> +<iframe width="640" height="320" src="https://www.youtube.com/embed/rPQoq7ThGAU?rel=0&start=60&end=140&hl=fr" frameborder="0" allowfullscreen></iframe> +</div> +</div> +<div class="videoblock"> +<div class="title">Youtube</div> +<div class="content"> +<iframe width="640" height="320" src="https://www.youtube.com/embed/rPQoq7ThGAU?rel=0&start=60&end=140&loop=1&modestbranding=1&controls=0&playlist=rPQoq7ThGAU&fs=0&theme=light&hl=fr" frameborder="0"></iframe> +</div> +</div> +<div class="videoblock"> +<div class="title">Youtube attribute at the end</div> +<div class="content"> +<video src="rPQoq7ThGAU#t=60,140" width="640" height="320" controls> +Your browser does not support the video tag. +</video> +</div> +</div> +<div class="videoblock"> +<div class="title">Vimeo</div> +<div class="content"> +<iframe width="640" height="320" src="https://player.vimeo.com/video/67480300?loop=1#at=60" frameborder="0"></iframe> +</div> +</div> +</div> +</div> +<div class="sect1"> +<h2 id="audio"><a class="anchor" href="#audio"></a><a class="link" href="#audio">29. Audio</a></h2> +<div class="sectionbody"> +<div class="audioblock"> +<div class="content"> +<audio src="ocean_waves.mp3" autoplay controls loop> +Your browser does not support the audio tag. +</audio> +</div> +</div> +</div> +</div> +<div class="sect1"> +<h2 id="admonition"><a class="anchor" href="#admonition"></a><a class="link" href="#admonition">30. Admonition</a></h2> +<div class="sectionbody"> +<div class="sect2"> +<h3 id="line_admonition"><a class="anchor" href="#line_admonition"></a><a class="link" href="#line_admonition">30.1. Line admonition</a></h3> +<div class="paragraph"> +<p>Admonition between a paragraph. +WARNING: Wolpertingers are known to nest in server racks. +Enter at your own risk.</p> +</div> +<div class="admonitionblock warning"> +<table> +<tr> +<td class="icon"> +<div class="title">Warning</div> +</td> +<td class="content"> +Wolpertingers are known to nest in server racks. +Enter at your own risk. +</td> +</tr> +</table> +</div> +<div class="paragraph"> +<p>+ +Is this inside admonition too?</p> +</div> +<div class="admonitionblock note"> +<table> +<tr> +<td class="icon"> +<div class="title">Note</div> +</td> +<td class="content"> +With tab. +</td> +</tr> +</table> +</div> +<div class="admonitionblock tip"> +<table> +<tr> +<td class="icon"> +<div class="title">Tip</div> +</td> +<td class="content"> +With multiple spaces. +</td> +</tr> +</table> +</div> +<div class="paragraph"> +<p>Can admonition added inside list,</p> +</div> +<div class="ulist"> +<ul> +<li> +<p>List 1</p> +<div class="admonitionblock important"> +<table> +<tr> +<td class="icon"> +<div class="title">Important</div> +</td> +<td class="content"> +inside list +</td> +</tr> +</table> +</div> +</li> +<li> +<p>List 2</p> +</li> +</ul> +</div> +<div class="admonitionblock caution"> +<table> +<tr> +<td class="icon"> +<div class="title">Caution</div> +</td> +<td class="content"> +admonition followed by list +* List item +</td> +</tr> +</table> +</div> +</div> +<div class="sect2"> +<h3 id="style_admonition"><a class="anchor" href="#style_admonition"></a><a class="link" href="#style_admonition">30.2. Style admonition</a></h3> +<div class="admonitionblock important"> +<table> +<tr> +<td class="icon"> +<div class="title">Important</div> +</td> +<td class="content"> + +<div class="title">Feeding the Werewolves</div> +<div class="paragraph"> +<p>While werewolves are hardy community members, keep in mind the following dietary concerns:</p> +</div> +<div class="olist arabic"> +<ol class="arabic"> +<li> +<p>They are allergic to cinnamon.</p> +</li> +<li> +<p>More than two glasses of orange juice in 24 hours makes them howl in harmony with alarms and sirens.</p> +</li> +<li> +<p>Celery makes them sad.</p> +</li> +</ol> +</div> +</td> +</tr> +</table> +</div> +<div class="admonitionblock tip"> +<table> +<tr> +<td class="icon"> +<div class="title">Tip</div> +</td> +<td class="content"> +Admonition with paragraph. +</td> +</tr> +</table> +</div> +<div class="paragraph"> +<p>Is this included in TIP?</p> +</div> +<div class="olist arabic"> +<ol class="arabic"> +<li> +<p>With</p> +</li> +<li> +<p>list</p> +</li> +</ol> +</div> +<div class="admonitionblock caution"> +<table> +<tr> +<td class="icon"> +<div class="title">Caution</div> +</td> +<td class="content"> + +<div class="literalblock"> +<div class="content"> +<pre>This is open block.</pre> +</div> +</div> +</td> +</tr> +</table> +</div> +<div class="admonitionblock warning"> +<table> +<tr> +<td class="icon"> +<div class="title">Warning</div> +</td> +<td class="content"> +Literal paragraph with admonition. +</td> +</tr> +</table> +</div> +</div> +<div class="sect2"> +<h3 id="icons"><a class="anchor" href="#icons"></a><a class="link" href="#icons">30.3. Icons</a></h3> +<div class="admonitionblock warning"> +<table> +<tr> +<td class="icon"> +<i class="fa icon-warning" title="Warning"></i> +</td> +<td class="content"> +Wolpertingers are known to nest in server racks. +Enter at your own risk. +</td> +</tr> +</table> +</div> +</div> +</div> +</div> +<div class="sect1"> +<h2 id="sidebar"><a class="anchor" href="#sidebar"></a><a class="link" href="#sidebar">31. Sidebar</a></h2> +<div class="sectionbody"> +<div class="sidebarblock"> +<div class="content"> +<div class="title">AsciiDoc history</div> +<div class="paragraph"> +<p>AsciiDoc was first released in Nov 2002 by Stuart Rackham. +It was designed from the start to be a shorthand syntax +for producing professional documents like DocBook and LaTeX.</p> +</div> +</div> +</div> +<div class="sidebarblock"> +<div class="content"> +<div class="title">Sidebar with list</div> +<div class="olist arabic"> +<ol class="arabic"> +<li> +<p>List</p> +</li> +<li> +<p>Item</p> +</li> +</ol> +</div> +</div> +</div> +</div> +</div> +<div class="sect1"> +<h2 id="example"><a class="anchor" href="#example"></a><a class="link" href="#example">32. Example</a></h2> +<div class="sectionbody"> +<div class="exampleblock"> +<div class="title">Example 1. Sample document</div> +<div class="content"> +<div class="paragraph"> +<p>Here’s a sample AsciiDoc document:</p> +</div> +<div class="listingblock"> +<div class="content"> +<pre>= Title of Document +Doc Writer +:toc: + +This guide provides...</pre> +</div> +</div> +<div class="paragraph"> +<p>The document header is useful, but not required.</p> +</div> +</div> +</div> +</div> +</div> +<div class="sect1"> +<h2 id="quote"><a class="anchor" href="#quote"></a><a class="link" href="#quote">33. Quote</a></h2> +<div class="sectionbody"> +<div class="quoteblock"> +<blockquote> +Quote or excerpt text +</blockquote> +<div class="attribution"> +— attribution<br> +<cite>citation title and information</cite> +</div> +</div> +<div class="quoteblock"> +<div class="title">After landing the cloaked Klingon bird of prey in Golden Gate park:</div> +<blockquote> +Everybody remember where we parked. +</blockquote> +<div class="attribution"> +— Captain James T. Kirk<br> +<cite>Star Trek IV: The Voyage Home</cite> +</div> +</div> +<div class="quoteblock"> +<blockquote> + +<div class="paragraph"> +<p>Dennis: Come and see the violence inherent in the system. Help! Help! I’m being repressed!</p> +</div> +<div class="paragraph"> +<p>King Arthur: Bloody peasant!</p> +</div> +<div class="paragraph"> +<p>Dennis: Oh, what a giveaway! Did you hear that? Did you hear that, eh? That’s what I’m on about! Did you see him repressing me? You saw him, Didn’t you?</p> +</div> +</blockquote> +<div class="attribution"> +— Monty Python and the Holy Grail +</div> +</div> +<div class="sect2"> +<h3 id="quoted_paragraph"><a class="anchor" href="#quoted_paragraph"></a><a class="link" href="#quoted_paragraph">33.1. Quoted paragraph</a></h3> +<div class="quoteblock"> +<blockquote> +I hold it that a little rebellion now and then is a good thing, +and as necessary in the political world as storms in the physical. +</blockquote> +<div class="attribution"> +— Thomas Jefferson<br> +<cite>Papers of Thomas Jefferson: Volume 11</cite> +</div> +</div> +<div class="paragraph"> +<p>"I hold it that a little rebellion now and then is a good thing, +and as necessary in the political world as storms in the physical."</p> +</div> +<div class="paragraph"> +<p>"I hold" +—Author</p> +</div> +<div class="quoteblock"> +<blockquote> +Author with tab +</blockquote> +<div class="attribution"> +— Author +</div> +</div> +<div class="paragraph"> +<p>"I hold</p> +</div> +<div class="listingblock"> +<div class="content"> +<pre>Block</pre> +</div> +</div> +<div class="paragraph"> +<p>it that" — Thomas Jefferson, Papers of Thomas Jefferson: Volume 11</p> +</div> +<div class="ulist"> +<ul> +<li> +<p>List item 1</p> +<div class="quoteblock"> +<blockquote> +a quote +</blockquote> +<div class="attribution"> +— Thomas Jefferson<br> +<cite>Papers of Thomas Jefferson: Volume 11</cite> +</div> +</div> +</li> +<li> +<p>List item 2</p> +</li> +</ul> +</div> +</div> +</div> +</div> +<div class="sect1"> +<h2 id="verse"><a class="anchor" href="#verse"></a><a class="link" href="#verse">34. Verse</a></h2> +<div class="sectionbody"> +<div class="verseblock"> +<pre class="content">The fog comes +on little cat feet.</pre> +<div class="attribution"> +— Carl Sandburg<br> +<cite>two lines from the poem Fog</cite> +</div> +</div> +<div class="verseblock"> +<pre class="content">The fog comes +on little cat feet. + +It sits looking +over harbor and city +on silent haunches +and then moves on.</pre> +<div class="attribution"> +— Carl Sandburg<br> +<cite>Fog</cite> +</div> +</div> +</div> +</div> +<div class="sect1"> +<h2 id="passthrough"><a class="anchor" href="#passthrough"></a><a class="link" href="#passthrough">35. Passthrough</a></h2> +<div class="sectionbody"> +<div class="paragraph"> +<p><code><em>A <strong>B</strong></em>+</code></p> +</div> +<div class="sect2"> +<h3 id="block_passthrough"><a class="anchor" href="#block_passthrough"></a><a class="link" href="#block_passthrough">35.1. Block passthrough</a></h3> +<video poster="images/movie-reel.png"> + <source src="videos/writing-zen.webm" type="video/webm"> +</video> +</div> +</div> +</div> +<div class="sect1"> +<h2 id="section_discrete"><a class="anchor" href="#section_discrete"></a><a class="link" href="#section_discrete">36. Section Discrete</a></h2> +<div class="sectionbody"> +<h3 id="discrete" class="discrete">Discrete</h3> +<div class="paragraph"> +<p>This is content of discrete section.</p> +</div> +<div class="sect2"> +<h3 id="after_discrete"><a class="anchor" href="#after_discrete"></a><a class="link" href="#after_discrete">36.1. After discrete</a></h3> +<div class="sidebarblock"> +<div class="content"> +<div class="paragraph"> +<p>Discrete headings are useful for making headings inside of other blocks, like +this sidebar.</p> +</div> +<h2 id="discrete_heading" class="discrete">Discrete Heading</h2> +<div class="paragraph"> +<p>Discrete headings can be used where sections are not permitted.</p> +</div> +</div> +</div> +<div class="paragraph"> +<p>END OF THE TEST.</p> +</div> +</div> +</div> +</div> +</div> +<div id="footer"> +<div id="footer-text"> + 1.1.1<br> +Last updated 2022-07-17 17:22:21 +0700 +</div> +</div> +</body> +</html>
\ No newline at end of file |