Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Pellentesque dignissim enim sit amet venenatis urna cursus eget. Eget arcu dictum varius duis at. Sed nisi lacus sed viverra tellus in hac habitasse. A iaculis at erat pellentesque adipiscing commodo elit at imperdiet. Enim praesent elementum facilisis leo vel fringilla est. Adipiscing commodo elit at imperdiet dui accumsan sit amet. Interdum consectetur libero id faucibus nisl tincidunt eget nullam non.

Block-level elements

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Pellentesque dignissim enim sit amet venenatis urna cursus eget.

Eget arcu dictum varius duis at. Sed nisi lacus sed viverra tellus in hac habitasse. A iaculis at erat pellentesque adipiscing commodo elit at imperdiet. Enim praesent elementum facilisis leo vel fringilla est.

Adipiscing commodo elit at imperdiet dui accumsan sit amet. Interdum consectetur libero id faucibus nisl tincidunt eget nullam non.

<p>

This is a short paragraph followed by three paragraphs of Lorem Ipsum text.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Non est ista, inquam, Piso, magna dissensio. Quasi ego id curem, quid ille aiat aut neget. Duo Reges: constructio interrete. Aut, Pylades cum sis, dices te esse Orestem, ut moriare pro amico?

Quod cum dixissent, ille contra. Cum praesertim illa perdiscere ludus esset. Bestiarum vero nullum iudicium puto. Ut optime, secundum naturam affectum esse possit.

Progredientibus autem aetatibus sensim tardeve potius quasi nosmet ipsos cognoscimus. Simul atque natum animal est, gaudet voluptate et eam appetit ut bonum, aspernatur dolorem ut malum. Ita multa dicunt, quae vix intellegam. Tollitur beneficium, tollitur gratia, quae sunt vincla concordiae. Tecum optime, deinde etiam cum mediocri amico. Quod praeceptum quia maius erat, quam ut ab homine videretur, idcirco assignatum est deo. Primum quid tu dicis breve? Aut haec tibi, Torquate, sunt vituperanda aut patrocinium voluptatis repudiandum.

<blockquote>

Single-line blockquote:

Contrary to popular belief, Lorem Ipsum is not simply random text.

Multi-line blockquote with a cite reference:

Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Demetris Kikizas, 2017

<table>

<dl>

banana

A long, curved fruit with a yellow skin and soft, sweet, white flesh inside.

lemon

An oval fruit that has a thick, yellow skin and sour juice.

orange

A round sweet fruit that has a thick orange skin and an orange centre divided into many parts.

watermelon

A large, round or oval-shaped fruit with dark green skin, sweet pink flesh, and a lot of black seeds.

<ul>

• List item one
  • List item one
    • List item one
    • List item two
    • List item three
    • List item four
  • List item two
  • List item three
  • List item four
• List item two
• List item three
• List item four

<ol>

1. List item one
   1. List item one
      1. List item one
      2. List item two
      3. List item three
      4. List item four
   2. List item two
   3. List item three
   4. List item four
2. List item two
3. List item three
4. List item four

<address>

Inline elements

<a>

This is an example of a link.

<abbr>

The abbreviation Dr stands for “Doctor”.

<cite>

“The <cite> element represents a reference to a creative work. It must include the title of the work or the name of the author (person, people or organization) or an URL reference, or a reference in abbreviated form”: https://www.w3.org/TR/html51/textlevel-semantics.html

“Foo bar baz” – Some organization

<code>

You will learn later on in these tests that word-wrap: break-word; will be your best friend.

<em>

This element is used to put emphasis on something. It is usually styled as italicized text.

<ins>

The ins element represents an addition to the document. This sentence is wrapped in <ins> tags.

<kbd>

This represents keyboard text, which is often styled like the <code> element.

“The <kbd> element represents user input (typically keyboard input, although it may also be used to represent other input, such as voice commands). When the <kbd> element is nested inside a <samp> element, it represents the input as it was echoed by the system. When the <kbd> element contains a <samp> element, it represents input based on system output, for example invoking a menu item. When the <kbd> element is nested inside another <kbd> element, it represents an actual key or other single unit of input as appropriate for the input mechanism.” – https://www.w3.org/TR/html51/textlevel-semantics.html

<mark>

The <mark> element is used to highlight text.

<pre>

.post-title {
    margin: 0 0 5px;
    font-weight: bold;
    font-size: 38px;
    line-height: 1.2;
}

<q>

Lorem ipsum dolor sit amet, consectetur adipiscing elit. – Some Person

The <q> element represents some phrasing content quoted from another source.

Quotation punctuation (such as quotation marks) that is quoting the contents
of the element must not appear immediately before, after, or inside <q>
elements; they will be inserted into the rendering by the user agent.

Content inside a <q> element must be quoted from another source, whose
address, if it has one, may be cited in the cite attribute. The source may
be fictional, as when quoting characters in a novel or screenplay.

– https://www.w3.org/TR/html51/textlevel-semantics.html

<s>

“The HTML <s> element renders text with a strikethrough, or a line through it. Use the <s> element to represent things that are no longer relevant or no longer accurate. However, <s> is not appropriate when indicating document edits; for that, use the <del> and <ins> elements, as appropriate.”: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/s

Example:

Recommended retail price: €3.99 per bottle

Now selling for just €2.99 a bottle!

<strong>

This element is usually styled as bold text. When one is nested inside another, the text becomes even bolder.

<sub>

The chemical formula of water is H₂O. (The number 2 should be lowered.)

<sup>

The equation of mass–energy equivalence is: E = mc². (The number 2 should be raised.)

<time>

The concert starts at 20:00.

<var>

This allows you to denote variables.

Obsolete elements

The following elements are “entirely obsolete” in HTML5 “and must not be used by authors”: https://www.w3.org/TR/html5/obsolete.html

<acronym>

Use <abbr> instead.

<big>

These tests are a big deal.

<del>

This element lets you strike out text. It is no longer supported in HTML5. Use <strike> instead.

Changelog

• 2018-12-14. Added explanation of <s> from MDN.
• 2018-12-14. Changed example for <address>.
• 2018-12-14. Converted tables, ordered lists and unordered lists to markdown.
• 2018-11-19. Imported document.