mirror of
https://github.com/foo-dogsquared/hugo-theme-more-contentful.git
synced 2025-01-31 10:58:19 +00:00
683 lines
24 KiB
HTML
683 lines
24 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en-us"><title>Asciidoctor Syntax Guide | More Contentful</title>
|
||
|
||
|
||
|
||
|
||
<link rel="stylesheet" href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/css/main.min.41ddef3aef88d6e34f0c569ba91d7523fc7b1fa10989de08e9ef90b031339757.css" /><meta name="generator" content="Hugo 0.96.0" />
|
||
<meta charset="utf-8">
|
||
<meta name="author" content="John Doe" />
|
||
|
||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||
<meta name="referrer" content="no-referrer" />
|
||
<meta name="description" content="The main purpose of this article is to make sure that all basic HTML Elements are decorated with CSS so as to not miss any possible elements when creating new themes for Hugo.
|
||
Headings Let’s start with all possible headings. The HTML <h1>—<h6> elements represent six levels of section headings. <h1> is the highest section level and <h6> is the lowest.
|
||
Heading 2 Heading 3 Heading 4 Heading 5 Heading 6 Paragraph According to the HTML5 specification by W3C, HTML documents consist of a tree of elements and text." /><meta name="twitter:card" content="summary"/>
|
||
<meta name="twitter:title" content="Asciidoctor Syntax Guide"/>
|
||
<meta name="twitter:description" content="The main purpose of this article is to make sure that all basic HTML Elements are decorated with CSS so as to not miss any possible elements when creating new themes for Hugo.
|
||
Headings Let’s start with all possible headings. The HTML <h1>—<h6> elements represent six levels of section headings. <h1> is the highest section level and <h6> is the lowest.
|
||
Heading 2 Heading 3 Heading 4 Heading 5 Heading 6 Paragraph According to the HTML5 specification by W3C, HTML documents consist of a tree of elements and text."/>
|
||
<meta property="og:title" content="Asciidoctor Syntax Guide" />
|
||
<meta property="og:description" content="The main purpose of this article is to make sure that all basic HTML Elements are decorated with CSS so as to not miss any possible elements when creating new themes for Hugo.
|
||
Headings Let’s start with all possible headings. The HTML <h1>—<h6> elements represent six levels of section headings. <h1> is the highest section level and <h6> is the lowest.
|
||
Heading 2 Heading 3 Heading 4 Heading 5 Heading 6 Paragraph According to the HTML5 specification by W3C, HTML documents consist of a tree of elements and text." />
|
||
<meta property="og:type" content="article" />
|
||
<meta property="og:url" content="https://foo-dogsquared.github.io/hugo-theme-more-contentful/articles/asciidoctor-syntax-guide/" /><meta property="article:section" content="articles" />
|
||
<meta property="article:published_time" content="2019-08-27T01:03:09+08:00" />
|
||
<meta property="article:modified_time" content="2022-05-04T12:42:09+08:00" />
|
||
|
||
<meta itemprop="name" content="Asciidoctor Syntax Guide">
|
||
<meta itemprop="description" content="The main purpose of this article is to make sure that all basic HTML Elements are decorated with CSS so as to not miss any possible elements when creating new themes for Hugo.
|
||
Headings Let’s start with all possible headings. The HTML <h1>—<h6> elements represent six levels of section headings. <h1> is the highest section level and <h6> is the lowest.
|
||
Heading 2 Heading 3 Heading 4 Heading 5 Heading 6 Paragraph According to the HTML5 specification by W3C, HTML documents consist of a tree of elements and text."><meta itemprop="datePublished" content="2019-08-27T01:03:09+08:00" />
|
||
<meta itemprop="dateModified" content="2022-05-04T12:42:09+08:00" />
|
||
<meta itemprop="wordCount" content="543">
|
||
<meta itemprop="keywords" content="asciidoctor,guide," /><link rel="canonical" type="text/html" href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/articles/asciidoctor-syntax-guide/" />
|
||
|
||
<script>
|
||
let theme = window.localStorage.getItem('theme');
|
||
if (theme) {
|
||
document.documentElement.dataset.theme = theme;
|
||
}
|
||
</script>
|
||
|
||
<body>
|
||
<div class="site__theme-btn" aria-label="Theme toggle">
|
||
|
||
<svg class="icon">
|
||
<use href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/icons/generic/color-swatch.svg#color-swatch"></use>
|
||
</svg>
|
||
|
||
<div class="site__theme-dropdown">
|
||
<div class="site__theme-dropdown-list">
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<div class="site__theme-item"
|
||
data-theme="Default Dark"
|
||
data-theme-dark
|
||
|
||
>Dark</div>
|
||
|
||
|
||
|
||
|
||
|
||
<div class="site__theme-item"
|
||
data-theme="Default Light"
|
||
|
||
data-theme-light
|
||
>Light</div>
|
||
|
||
|
||
|
||
<div class="site__theme-item"
|
||
data-theme="Dracula"
|
||
|
||
|
||
>Dracula</div>
|
||
|
||
|
||
<div class="site__theme-item"
|
||
data-theme="Nord"
|
||
|
||
|
||
>Nord</div>
|
||
|
||
|
||
<div class="site__theme-item"
|
||
data-theme="Solarized Dark"
|
||
|
||
|
||
>Solarized Dark</div>
|
||
|
||
|
||
<div class="site__theme-item"
|
||
data-theme="Solarized Light"
|
||
|
||
|
||
>Solarized Light</div>
|
||
|
||
<div class="site__theme-item" data-theme-system>
|
||
OS default
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<script defer>
|
||
const themeDropdown = document.querySelector('.site__theme-btn');
|
||
themeDropdown.addEventListener('click', (event) => {
|
||
const { target } = event;
|
||
if (target.classList.contains("site__theme-item")) {
|
||
if (target.dataset.theme) {
|
||
theme = target.dataset.theme;
|
||
window.localStorage.setItem("theme", theme);
|
||
document.documentElement.dataset.theme = theme;
|
||
} else {
|
||
window.localStorage.removeItem("theme");
|
||
delete document.documentElement.dataset.theme;
|
||
}
|
||
}
|
||
});
|
||
</script>
|
||
<nav aria-label="Site header">
|
||
<a class="site__title" href="https://foo-dogsquared.github.io/hugo-theme-more-contentful">More Contentful</a>
|
||
<div class="list site__links">
|
||
|
||
<a href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/about/">About</a>
|
||
<a href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/categories/">Categories</a>
|
||
<a href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/recipes/">Recipes</a>
|
||
<a href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/tags/">Tags</a>
|
||
|
||
|
||
</div>
|
||
</nav>
|
||
<hr>
|
||
|
||
<article class="post--single">
|
||
<header>
|
||
<h1>Asciidoctor Syntax Guide</h1>
|
||
</header>
|
||
<div class="list post__meta"><time datetime="2019-08-27 01:03:09 +0800 +0800" title="Created">
|
||
|
||
<svg class="icon">
|
||
<use href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/icons/generic/calendar.svg#calendar"></use>
|
||
</svg>
|
||
|
||
<span style="margin-left: 0.5em;">2019-08-27</span>
|
||
</time>
|
||
<time datetime="2022-05-04 12:42:09 +0800 +0800" title="Updated">
|
||
|
||
<svg class="icon">
|
||
<use href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/icons/generic/refresh.svg#refresh"></use>
|
||
</svg>
|
||
|
||
<span style="margin-left: 0.5em;">2022-05-04</span>
|
||
</time>
|
||
</div>
|
||
|
||
|
||
|
||
|
||
<style>
|
||
#TableOfContents:not(:empty)::before {
|
||
content: "Table of contents";
|
||
font-weight: bold;
|
||
}
|
||
</style>
|
||
<nav id="TableOfContents">
|
||
<ul>
|
||
<li><a href="#_headings">Headings</a></li>
|
||
<li><a href="#_heading_2">Heading 2</a>
|
||
<ul>
|
||
<li><a href="#_heading_3">Heading 3</a></li>
|
||
</ul>
|
||
</li>
|
||
<li><a href="#_paragraph">Paragraph</a></li>
|
||
<li><a href="#_list_types">List Types</a>
|
||
<ul>
|
||
<li><a href="#_ordered_list">Ordered List</a></li>
|
||
<li><a href="#_unordered_list">Unordered List</a></li>
|
||
<li><a href="#_nested_list">Nested list</a></li>
|
||
<li><a href="#_definition_list">Definition List</a></li>
|
||
</ul>
|
||
</li>
|
||
<li><a href="#_blockquotes">Blockquotes</a></li>
|
||
<li><a href="#_tables">Tables</a></li>
|
||
<li><a href="#_code">Code</a></li>
|
||
<li><a href="#_other_stuff_sub_sup_kbd_etc">Other stuff — sub, sup, kbd, etc.</a></li>
|
||
</ul>
|
||
</nav>
|
||
|
||
|
||
<main>
|
||
|
||
<div id="preamble">
|
||
<div class="sectionbody">
|
||
<div class="paragraph">
|
||
<p>The main purpose of this article is to make sure that all
|
||
basic HTML Elements are decorated with CSS so as to not miss
|
||
any possible elements when creating new themes for Hugo.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="sect1">
|
||
<h2 id="_headings">Headings</h2>
|
||
<div class="sectionbody">
|
||
<div class="paragraph">
|
||
<p>Let’s start with all possible headings.
|
||
The HTML <code><h1></code>—<code><h6></code> elements represent six levels of section headings.
|
||
<code><h1></code> is the highest section level and <code><h6></code> is the lowest.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="sect1">
|
||
<h2 id="_heading_2">Heading 2</h2>
|
||
<div class="sectionbody">
|
||
<div class="sect2">
|
||
<h3 id="_heading_3">Heading 3</h3>
|
||
<div class="sect3">
|
||
<h4 id="_heading_4">Heading 4</h4>
|
||
<div class="sect4">
|
||
<h5 id="_heading_5">Heading 5</h5>
|
||
<div class="sect5">
|
||
<h6 id="_heading_6">Heading 6</h6>
|
||
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="sect1">
|
||
<h2 id="_paragraph">Paragraph</h2>
|
||
<div class="sectionbody">
|
||
<div class="paragraph">
|
||
<p>According to the <a href="https://www.w3.org/TR/html5/dom.html=elements">HTML5 specification</a>
|
||
by <a href="https://www.w3.org/">W3C</a>, <strong>HTML documents consist of a tree of elements and text</strong>.
|
||
Each element is denoted in the source by a <a href="https://www.w3.org/TR/html5/syntax.html=syntax-start-tags">start tag</a>,
|
||
such as <code><body></code>, and an <a href="https://www.w3.org/TR/html5/syntax.html=syntax-end-tags">end tag</a>,
|
||
such as <code></body></code>.
|
||
(<strong>Certain start tags and end tags can in certain cases be omitted and are implied by other tags.</strong>)</p>
|
||
</div>
|
||
<div class="paragraph">
|
||
<p>Elements can have attributes, which control how the elements work.
|
||
For example, hyperlink are formed using the <code>a</code> element and its <code>href</code> attribute.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="sect1">
|
||
<h2 id="_list_types">List Types</h2>
|
||
<div class="sectionbody">
|
||
<div class="sect2">
|
||
<h3 id="_ordered_list">Ordered List</h3>
|
||
<div class="olist arabic">
|
||
<ol class="arabic">
|
||
<li>
|
||
<p>First item</p>
|
||
</li>
|
||
<li>
|
||
<p>Second item</p>
|
||
</li>
|
||
<li>
|
||
<p>Third item</p>
|
||
</li>
|
||
</ol>
|
||
</div>
|
||
</div>
|
||
<div class="sect2">
|
||
<h3 id="_unordered_list">Unordered List</h3>
|
||
<div class="ulist">
|
||
<ul>
|
||
<li>
|
||
<p>List item</p>
|
||
</li>
|
||
<li>
|
||
<p>Another item</p>
|
||
</li>
|
||
<li>
|
||
<p>And another item</p>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
<div class="sect2">
|
||
<h3 id="_nested_list">Nested list</h3>
|
||
<div class="ulist">
|
||
<ul>
|
||
<li>
|
||
<p>First item</p>
|
||
</li>
|
||
<li>
|
||
<p>Second item</p>
|
||
<div class="ulist">
|
||
<ul>
|
||
<li>
|
||
<p>Second item First subitem</p>
|
||
</li>
|
||
<li>
|
||
<p>Second item second subitem</p>
|
||
<div class="ulist">
|
||
<ul>
|
||
<li>
|
||
<p>Second item Second subitem First sub-subitem</p>
|
||
</li>
|
||
<li>
|
||
<p>Second item Second subitem Second sub-subitem</p>
|
||
</li>
|
||
<li>
|
||
<p>Second item Second subitem Third sub-subitem</p>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
</li>
|
||
<li>
|
||
<p>Second item Third subitem</p>
|
||
<div class="olist lowerroman">
|
||
<ol class="lowerroman" type="i">
|
||
<li>
|
||
<p>Second item Third subitem First sub-subitem</p>
|
||
</li>
|
||
<li>
|
||
<p>Second item Third subitem Second sub-subitem</p>
|
||
</li>
|
||
<li>
|
||
<p>Second item Third subitem Third sub-subitem</p>
|
||
</li>
|
||
</ol>
|
||
</div>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
</li>
|
||
<li>
|
||
<p>Third item</p>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
<div class="sect2">
|
||
<h3 id="_definition_list">Definition List</h3>
|
||
<div class="paragraph">
|
||
<p>HTML also supports definition lists.</p>
|
||
</div>
|
||
<div class="dlist">
|
||
<dl>
|
||
<dt class="hdlist1">Blanco tequila</dt>
|
||
<dd>
|
||
<p>The purest form of the blue agave spirit…</p>
|
||
</dd>
|
||
<dt class="hdlist1">Reposado tequila</dt>
|
||
<dd>
|
||
<p>Typically aged in wooden barrels for between two and eleven months…</p>
|
||
</dd>
|
||
</dl>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="sect1">
|
||
<h2 id="_blockquotes">Blockquotes</h2>
|
||
<div class="sectionbody">
|
||
<div class="paragraph">
|
||
<p>The blockquote element represents content that is quoted from another source, optionally with a citation which must be within a <code>footer</code> or <code>cite</code> element, and optionally with in-line changes such as annotations and abbreviations.</p>
|
||
</div>
|
||
<div class="quoteblock">
|
||
<blockquote>
|
||
Quoted text.
|
||
This line is part of the same quote.
|
||
Also you can <em>put</em> <strong>Asciidoctor</strong> into a blockquote.
|
||
</blockquote>
|
||
</div>
|
||
<div class="paragraph">
|
||
<p>Blockquote with a citation.</p>
|
||
</div>
|
||
<div class="quoteblock">
|
||
<blockquote>
|
||
<div class="paragraph">
|
||
<p>My goal wasn’t to make a ton of money. It was to build good computers. I only started the company when I realized I could be an engineer forever.</p>
|
||
</div>
|
||
</blockquote>
|
||
<div class="attribution">
|
||
— Steve Wozniak
|
||
</div>
|
||
</div>
|
||
<div class="paragraph">
|
||
<p>According to Mozilla’s website, Firefox 1.0 was released in 2004 and became a big success.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="sect1">
|
||
<h2 id="_tables">Tables</h2>
|
||
<div class="sectionbody">
|
||
<div class="paragraph">
|
||
<p>Tables aren’t part of the core Markdown spec, but Hugo supports them.</p>
|
||
</div>
|
||
<table class="tableblock frame-all grid-all stretch">
|
||
<colgroup>
|
||
<col style="width: 25%;"/>
|
||
<col style="width: 25%;"/>
|
||
<col style="width: 25%;"/>
|
||
<col style="width: 25%;"/>
|
||
</colgroup>
|
||
<thead>
|
||
<tr>
|
||
<th class="tableblock halign-left valign-top">ID</th>
|
||
<th class="tableblock halign-left valign-top">Make</th>
|
||
<th class="tableblock halign-left valign-top">Model</th>
|
||
<th class="tableblock halign-left valign-top">Year</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr>
|
||
<td class="tableblock halign-left valign-top"><p class="tableblock">1</p></td>
|
||
<td class="tableblock halign-left valign-top"><p class="tableblock">Honda</p></td>
|
||
<td class="tableblock halign-left valign-top"><p class="tableblock">Accord</p></td>
|
||
<td class="tableblock halign-left valign-top"><p class="tableblock">2009</p></td>
|
||
</tr>
|
||
<tr>
|
||
<td class="tableblock halign-left valign-top"><p class="tableblock">2</p></td>
|
||
<td class="tableblock halign-left valign-top"><p class="tableblock">Toyota</p></td>
|
||
<td class="tableblock halign-left valign-top"><p class="tableblock">Camry</p></td>
|
||
<td class="tableblock halign-left valign-top"><p class="tableblock">2012</p></td>
|
||
</tr>
|
||
<tr>
|
||
<td class="tableblock halign-left valign-top"><p class="tableblock">3</p></td>
|
||
<td class="tableblock halign-left valign-top"><p class="tableblock">Hyundai</p></td>
|
||
<td class="tableblock halign-left valign-top"><p class="tableblock">Elantra</p></td>
|
||
<td class="tableblock halign-left valign-top"><p class="tableblock">2010</p></td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
<div class="paragraph">
|
||
<p>Colons can be used to align 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">Tables</p></td>
|
||
<td class="tableblock halign-center valign-top"><p class="tableblock">Are</p></td>
|
||
<td class="tableblock halign-right valign-top"><p class="tableblock">Cool</p></td>
|
||
</tr>
|
||
<tr>
|
||
<td class="tableblock halign-left valign-top"><p class="tableblock">align: left</p></td>
|
||
<td class="tableblock halign-center valign-top"><p class="tableblock">align: center</p></td>
|
||
<td class="tableblock halign-right valign-top"><p class="tableblock">align: right</p></td>
|
||
</tr>
|
||
<tr>
|
||
<td class="tableblock halign-left valign-top"><p class="tableblock">align: left</p></td>
|
||
<td class="tableblock halign-center valign-top"><p class="tableblock">align: center</p></td>
|
||
<td class="tableblock halign-right valign-top"><p class="tableblock">align: right</p></td>
|
||
</tr>
|
||
<tr>
|
||
<td class="tableblock halign-left valign-top"><p class="tableblock">align: left</p></td>
|
||
<td class="tableblock halign-center valign-top"><p class="tableblock">align: center</p></td>
|
||
<td class="tableblock halign-right valign-top"><p class="tableblock">align: right</p></td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
<div class="paragraph">
|
||
<p>You can also use inline Markdown.</p>
|
||
</div>
|
||
<table class="tableblock frame-all grid-all stretch">
|
||
<colgroup>
|
||
<col style="width: 25%;"/>
|
||
<col style="width: 25%;"/>
|
||
<col style="width: 25%;"/>
|
||
<col style="width: 25%;"/>
|
||
</colgroup>
|
||
<tbody>
|
||
<tr>
|
||
<td class="tableblock halign-left valign-top"><p class="tableblock">Inline</p></td>
|
||
<td class="tableblock halign-left valign-top"><p class="tableblock">Asciidoctor</p></td>
|
||
<td class="tableblock halign-left valign-top"><p class="tableblock">In</p></td>
|
||
<td class="tableblock halign-left valign-top"><p class="tableblock">Table</p></td>
|
||
</tr>
|
||
<tr>
|
||
<td class="tableblock halign-left valign-top"><p class="tableblock"><em>italics</em></p></td>
|
||
<td class="tableblock halign-left valign-top"><p class="tableblock"><strong>bold</strong></p></td>
|
||
<td class="tableblock halign-left valign-top"><p class="tableblock"><mark>mark</mark></p></td>
|
||
<td class="tableblock halign-left valign-top"><p class="tableblock"><code>code</code></p></td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
<div class="sect1">
|
||
<h2 id="_code">Code</h2>
|
||
<div class="sectionbody">
|
||
<div class="listingblock">
|
||
<div class="content">
|
||
<pre class="highlight"><code class="language-html" data-lang="html"><!DOCTYPE html>
|
||
<html lang="en">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<title>Example HTML5 Document</title>
|
||
</head>
|
||
<body>
|
||
<p>Test</p>
|
||
</body>
|
||
</html></code></pre>
|
||
</div>
|
||
</div>
|
||
<div class="paragraph">
|
||
<p>As you can see, content output from Asciidoctor does not have
|
||
syntax highlighting.
|
||
You can use the built-in Hugo shortcode instead.</p>
|
||
</div>
|
||
<div class="paragraph">
|
||
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-html" data-lang="html"><span style="display:flex;"><span><span style="color:#75715e"><!DOCTYPE html></span>
|
||
</span></span><span style="display:flex;"><span><<span style="color:#f92672">html</span> <span style="color:#a6e22e">lang</span><span style="color:#f92672">=</span><span style="color:#e6db74">"en"</span>>
|
||
</span></span><span style="display:flex;"><span><<span style="color:#f92672">head</span>>
|
||
</span></span><span style="display:flex;"><span> <<span style="color:#f92672">meta</span> <span style="color:#a6e22e">charset</span><span style="color:#f92672">=</span><span style="color:#e6db74">"UTF-8"</span>>
|
||
</span></span><span style="display:flex;"><span> <<span style="color:#f92672">title</span>>Example HTML5 Document</<span style="color:#f92672">title</span>>
|
||
</span></span><span style="display:flex;"><span></<span style="color:#f92672">head</span>>
|
||
</span></span><span style="display:flex;"><span><<span style="color:#f92672">body</span>>
|
||
</span></span><span style="display:flex;"><span> <<span style="color:#f92672">p</span>>Test</<span style="color:#f92672">p</span>>
|
||
</span></span><span style="display:flex;"><span></<span style="color:#f92672">body</span>>
|
||
</span></span><span style="display:flex;"><span></<span style="color:#f92672">html</span>></span></span></code></pre></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="sect1">
|
||
<h2 id="_other_stuff_sub_sup_kbd_etc">Other stuff — sub, sup, kbd, etc.</h2>
|
||
<div class="sectionbody">
|
||
<div class="paragraph">
|
||
<p>H<sub>2</sub>O</p>
|
||
</div>
|
||
<div class="paragraph">
|
||
<p>C<sub>6</sub>H<sub>12</sub>O<sub>6</sub></p>
|
||
</div>
|
||
<div class="paragraph">
|
||
<p>X<sup>n</sup> + Y<sup>n</sup> = Z<sup>n</sup></p>
|
||
</div>
|
||
<div class="paragraph">
|
||
<p>Press <kbd>X</kbd> to win. Or press <kbd>kbd:[CTRL</kbd>+<kbd>ALT</kbd>+<kbd>F</kbd>] to show FPS counter.
|
||
<sup class="footnote">[<a id="_footnoteref_1" class="footnote" href="#_footnotedef_1" title="View footnote.">1</a>]</sup></p>
|
||
</div>
|
||
<div class="paragraph">
|
||
<p><mark>As a unit of information in information theory, the bit has alternatively been called a shannon</mark>, named after Claude Shannon, the founder of field of information theory.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div id="footnotes">
|
||
<hr/>
|
||
<div class="footnote" id="_footnotedef_1">
|
||
<a href="#_footnoteref_1">1</a>. This requires <a href="https://asciidoctor.org/docs/user-manual/#keyboard-shortcuts">setting experimental flags enabled</a>.
|
||
</div>
|
||
</div>
|
||
|
||
</main>
|
||
|
||
<hr>
|
||
<div class="post__meta--single">
|
||
|
||
|
||
|
||
<p data-content-publication-date="2019-08-27 01:03:09 +0800 +0800">Created: <time datetime="2019-08-27">2019-08-27</time></p>
|
||
|
||
|
||
<p data-content-modification-date="2022-05-04 12:42:09 +0800 +0800">Updated: <time datetime="2022-05-04">2022-05-04</time></p>
|
||
|
||
|
||
</div>
|
||
</article>
|
||
|
||
|
||
<hr><footer aria-label="Site footer">
|
||
|
||
<p><a href="#top">Back to top</a></p>
|
||
|
||
|
||
|
||
<p>Available in other languages:
|
||
<span class="list site__languages">
|
||
|
||
<a href="/hugo-theme-more-contentful/en" hreflang="en">English</a>
|
||
|
||
<a href="/hugo-theme-more-contentful/tl" hreflang="tl">Tagalog</a>
|
||
|
||
</span>
|
||
</p>
|
||
|
||
|
||
|
||
|
||
|
||
<ul class="list site__socials">
|
||
|
||
|
||
|
||
<li>
|
||
<a class="site__social-icon" rel="me" href="https://example.org/gmail" aria-label="E-mail">
|
||
<svg class="icon">
|
||
<use href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/icons/brand/gmail.svg#gmail"></use>
|
||
</svg>
|
||
</a>
|
||
</li><li>
|
||
<a class="site__social-icon" rel="me" href="https://example.org/keybase" aria-label="Keybase">
|
||
<svg class="icon">
|
||
<use href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/icons/brand/keybase.svg#keybase"></use>
|
||
</svg>
|
||
</a>
|
||
</li><li>
|
||
<a class="site__social-icon" rel="me" href="https://example.org/devdotto" aria-label="Dev.to">
|
||
<svg class="icon">
|
||
<use href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/icons/brand/devdotto.svg#devdotto"></use>
|
||
</svg>
|
||
</a>
|
||
</li><li>
|
||
<a class="site__social-icon" rel="me" href="https://example.org/github/" aria-label="GitHub">
|
||
<svg class="icon">
|
||
<use href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/icons/brand/github.svg#github"></use>
|
||
</svg>
|
||
</a>
|
||
</li><li>
|
||
<a class="site__social-icon" rel="me" href="https://example.org/gitlab" aria-label="GitLab">
|
||
<svg class="icon">
|
||
<use href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/icons/brand/gitlab.svg#gitlab"></use>
|
||
</svg>
|
||
</a>
|
||
</li><li>
|
||
<a class="site__social-icon" rel="me" href="https://example.org/lichess" aria-label="Lichess">
|
||
<svg class="icon">
|
||
<use href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/icons/brand/lichess.svg#lichess"></use>
|
||
</svg>
|
||
</a>
|
||
</li><li>
|
||
<a class="site__social-icon" rel="me" href="https://example.org/picartodottv" aria-label="Picarto.tv">
|
||
<svg class="icon">
|
||
<use href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/icons/brand/picartodottv.svg#picartodottv"></use>
|
||
</svg>
|
||
</a>
|
||
</li><li>
|
||
<a class="site__social-icon" rel="me" href="https://example.org/pixiv" aria-label="Pixiv">
|
||
<svg class="icon">
|
||
<use href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/icons/brand/pixiv.svg#pixiv"></use>
|
||
</svg>
|
||
</a>
|
||
</li><li>
|
||
<a class="site__social-icon" rel="me" href="https://example.org/twitch" aria-label="Twitch">
|
||
<svg class="icon">
|
||
<use href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/icons/brand/twitch.svg#twitch"></use>
|
||
</svg>
|
||
</a>
|
||
</li><li>
|
||
<a class="site__social-icon" rel="me" href="https://example.org/twitter" aria-label="Twitter">
|
||
<svg class="icon">
|
||
<use href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/icons/brand/twitter.svg#twitter"></use>
|
||
</svg>
|
||
</a>
|
||
</li><li>
|
||
<a class="site__social-icon" rel="me" href="https://example.org/youtube" aria-label="YouTube">
|
||
<svg class="icon">
|
||
<use href="https://foo-dogsquared.github.io/hugo-theme-more-contentful/icons/brand/youtube.svg#youtube"></use>
|
||
</svg>
|
||
</a>
|
||
</li></ul>
|
||
|
||
|
||
|
||
|
||
<p>© 2022 More Contentful</p>
|
||
</footer>
|
||
|
||
</body>
|
||
</html>
|