Text

Headings

explain how to use, H1 only once, H2 as page level titles, h3 has content sections, h4 - h6 as meaningful sub-content sections logically following each other. It is rare that h5 or h6 would be needed.

Heading Level 1

Heading Level 2

Heading Level 3

Heading Level 4

Heading Level 5
Heading Level 6

<h1>Heading Level 1</h1>
<h2>Heading Level 2</h2>
<h3>Heading Level 3</h3>
<h4>Heading Level 4</h4>
<h5>Heading Level 5</h5>
<h6>Heading Level 6</h6>

Paragraph

A paragraph (from the Greek paragraphos, "to write beside" or "written beside") is a group of sentences with one topic. It is also a self-contained unit of a discourse in writing dealing with a particular point or idea. A paragraph consists of one or more sentences. Though not required by the syntax of any language, paragraphs are usually an expected part of formal writing, used to organize longer prose.

<p>A paragraph (from the Greek paragraphos, "to write beside" or "written beside") is a group of sentences with one topic. It is also a self-contained unit of a discourse in writing dealing with a particular point or idea. A paragraph consists of one or more sentences. Though not required by the syntax of any language, paragraphs are usually an expected part of formal writing, used to organize longer prose.</p>

Blockquote

A block quotation (also known as a long quotation or extract) is a quotation in a written document, that is set off from the main text as a paragraph, or block of text, and typically distinguished visually using indentation and a different typeface or smaller size quotation.

<blockquote>A block quotation (also known as a long quotation or extract) is a quotation in a written document, that is set off from the main text as a paragraph, or block of text, and typically distinguished visually using indentation and a different typeface or smaller size quotation.</blockquote>

Inline Text Semantic Elements

These inline HTML elements are used to define the meaning, structure or style of text. A more detailed and comprehensive list of inline text semantics is available on the Mozilla Developer Network's HTML element reference.

This is a text link

Strong is used to indicate strong importance and is usually styled as bold text.

This text has added emphasis and is usually styled as itallic text.

The b element is stylistically different text from normal text, without any special importance.

The i element is text that is set off from the normal text.

The u element is text with an unarticulated, though explicitly rendered, non-textual annotation.

This text is deleted and This text is inserted.

This text has a strikethrough.

Superscript®

Subscript for things like H2O.

This small text is small for for fine print, etc.

Abbreviation: HTML

Keybord input: Cmd

This text is a short inline quotation that doesn't require paragraph breaks.

A citation represents a reference to a creative work. For example, more information can be found in [ISO-0000].

The dfn element indicates a definition of a term.

The mark element indicates a highlight.

This is what inline code looks like.

This is sample output from a computer program.

The variarble element, such as x = y

<p><a href="#">This is a text link</a></p>

<p><strong>Strong is used to indicate strong importance and is usually styled as bold text</strong>.</p>

<p><em>This text has added emphasis and is usually styled as itallic text.</em></p>

<p>The <b>b element</b> is stylistically different text from normal text, without any special importance.</p>

<p>The <i>i element</i> is text that is set off from the normal text.</p>

<p>The <u>u element</u> is text with an unarticulated, though explicitly rendered, non-textual annotation.</p>

<p><del>This text is deleted</del> and <ins>This text is inserted</ins>.</p>

<p><s>This text has a strikethrough.</s></p>

<p>Superscript<sup>®</sup></p>

<p>Subscript for things like H<sub>2</sub>O.</p>

<p><small>This small text is small for for fine print, etc.</small></p>

<p>Abbreviation: <abbr title="HyperText Markup Language">HTML</abbr></p>

<p>Keybord input: <kbd>Cmd</kbd></p>

<p>This text is a <q cite="https://developer.mozilla.org/en-US/docs/HTML/Element/q">short inline quotation</q> that doesn't require paragraph breaks.</p>

<p>A citation represents a reference to a creative work. For example, more information can be found in <cite>[ISO-0000]</cite>.</p>

<p>The <dfn>dfn element</dfn> indicates a definition of a term.</p>

<p>The <mark>mark element</mark> indicates a highlight.</p>

<p><code>This is what inline code looks like.</code></p>

<p><samp>This is sample output from a computer program.</samp></p>

<p>The <var>variarble element</var>, such as <var>x</var> = <var>y</var></p>

Time

A time element with a machine-readable datetime attribute:

<time datetime="2015-02-13T13:00-05:00">Friday, February 13, 2015, 1:00PM EST</time>

Preformatted Text

Preformatted text preserves formatting in text, where formatting is preserved. It's useful for previewing code.

<pre>Previewing previews could get pretty meta, like pointing two mirrors at each other.</pre>

Horizontal Rule

Horizontal rules are for breaks in content, usually of different types. They automatically span the whole page.


The content above
<hr>
is separated from the content below.