Ron's Guide

HTML lists can be used for a variety of different things, this tutorial will show you the basics.

---

There are three different types of lists in HTML; <ol>, <ul>, and <dl>...

<ol> - Ordered Lists

Here is an Example of an order list...

I'm starting an ordered list!

<ol>
  <li>This is the 1st thing on my list</li>
  <li>This is the 2nd thing on my list</li>
  <li>This is the 3rd thing on my list</li>
</ol>

Here is what your browser will display...

I'm starting an ordered list!

1. This is the 1st thing on my list
2. This is the 2nd thing on my list
3. This is the 3rd thing on my list

---

<ul> - Unordered Lists

Here is an Example of unordered list...

I'm Starting an unordered list!

<ul>
  <li> This is the 1st thing on my list</li>
  <li> This is the 2nd thing on my list</li>
  <li> This is the 3rd thing on my list</li>
</ul>

Here is what your browser will display...

I'm starting an unordered list!

• This is the 1st thing on my list
• This is the 2nd thing on my list
• This is the 3rd thing on my list

---

<dl> - Definition Lists

Here is an example of a defintion list...

I'm starting a definiton list!

<dl>
  <dt>This is the 1st thing on my list</dt>
    <dd>definition lists are great!</dd>
    <dd>Not to mention useful!</dd>

  <dt>This is the 2nd thing on my list</dt>
    <dd>definition lists are great!</dd>
    <dd>Not to mention useful!</dd>

  <dt>This is the 3rd thing on my list</dt>
   <dd>definition lists are great!</dd>
   <dd>Not to mention useful!</dd>
</dl>

Here is what your browser will display... I'm starting a definiton list!

This is the 1st thing on my list

Definition lists are great!

Not to mention useful!

This is the 2nd thing on my list

Definition lists are great!

Not to mention useful!

This is the 3rd thing on my list

Definition lists are great!

Not to mention useful!

• Discuss this tutorial
• Rate this tutorial
• Tell a friend