Reviewing the list types

Type 1: Unordered list

The <ul> element represents an unordered list of items, typically rendered as a bulleted list. 

<ul>
  <li>Flowers</li>
  <li>Trees</li>
  <li>Birds</li>
  <li>Bees</li>
</ul>

Type 2 - Ordered list

The <ol> element represents an ordered list of items — typically rendered as a numbered list.

  1. Make the bed
  2. Clean the bathroom
  3. Wash the dishes
  4. Hang the washing
<ol>
  <li>Make the bed</li>
  <li>Clean the bathroom</li>
  <li>Wash the dishes</li>
  <li>Hang the washing</li>
</ol>

Type 3 - Description list

The <dl> element represents a description list. The element encloses a list of groups of terms (specified using the <dt> element) and descriptions (provided by <dd> elements).

Frog
Wet green thing
Rabbit
Warm fluffy thing
Snake
Cold dry thing
<dl>
  <dt>Frog</dt>
    <dd>Wet green thing</dd>
  <dt>Rabbit</dt>
    <dd>Warm fluffy thing</dd>
  <dt>Snake</dt>
    <dd>Cold dry thing</dd>
</dl>

Example: A styled unordered list

<ul>
  <li>Rabbits</li>
  <li>Foxes</li>
  <li>Birds</li>
</ul>

Example: A nested unordered list

<ul>
  <li>Rabbits
    <ul>
      <li>Holland Lop</li>
      <li>European rabbit</li>
      <li>Rex rabbit</li>
      <li>Pygmy rabbit</li>
    </ul>
  </li>
  <li>Foxes</li>
  <li>Birds</li>
</ul>

Testing home