Tutorial Element Style & Usage Guide

This guide contains the different HTML elements you can use inside of your tutorial. Copy the code in the black box for the element you want to use and paste it into your tutorial.

Heading 2

<h2>Heading 2</h2>

Heading 3

<h3>Heading 3</h3>

Heading 4

<h4>Heading 4</h4>

Heading 5

<h5>Heading 5</h5>

Heading 6

<h5>Heading 6</h5>

Paragraph

This is a paragraph with a link and some bolded and emphasized text.

<p>
  This is a paragraph <a href="#">with a link</a>
  and some <strong> href="#">bolded </strong> and
  <em> href="#">emphasized </em> text.
</p>

Ordered List

1. List Item
2. List Item
3. List Item

<ol>
  <li>Item 1</li>
  <li>Item 2</li>
  <li>Item 3</li>
</ol>

Unordered List

• List Item
• List Item
• List Item

<ul>
  <li>Item 1</li>
  <li>Item 2</li>
  <li>Item 3</li>
</ul>

Large Step-by-step List

1. Content for Step 1
2. Content for Step 2
3. Content for Step 3

<ol class="steps">
  <li>Item 1</li>
  <li>Item 2</li>
  <li>Item 3</li>
</ul>

Image

<img width="400" alt="Description..." src="http://example.com/cat.jpg" />

Code

<pre class="code">
  this is a line of code
  this is another line
</pre>

Horizontal rule

---

<hr />