HTML List

HTML supports ordered, unordered, and defined lists:

Ordered list

  1. First list item
  2. Second list item
  3. Third list item

Unordered list

  • List item
  • List item
  • List item

Online examples

Unordered list
This example demonstrates an unordered list.

Ordered list
This example demonstrates an ordered list.

(You can find more examples at the bottom of this page.)

HTML unordered list

An unordered list is a list of items. The items in this column are marked with bold dots (typical small black circles).

Unordered lists use the <ul> tag

<ul>
  <li>Coffee</li>
  <li>Milk</li>
</ul>

The browser displays as follows:

  • Coffee
  • Milk

HTML ordered list

Similarly, an ordered list is a list of items, and the list items are marked with numbers. The ordered list starts with the <ol> tag. Each list item starts with the <li> tag.

List items are marked with numbers.

<ol>
  <li>Coffee</li>
  <li>Milk</li>
</ol>

The browser displays as follows:

  1. Coffee
  2. Milk

HTML custom list

A custom list is not just a list of items, but a combination of items and their comments.

The custom list starts with the <dl> tag. Each custom list item starts with <dt>. The definition of each custom list item starts with <dd>.

<dl>
  <dt>Coffee</dt>
    <dd>- black hot drink</dd>
  <dt>Milk</dt>
    <dd>- white cold drink</dd>
</dl>

The browser displays as follows:

Coffee
- black hot drink
Milk
- white cold drink

Note-useful tips

Tip: Paragraphs, line breaks, pictures, links and other lists can be used inside list items.

More examples

Different types of ordered lists
This example demonstrates different types of ordered lists.

Different types of unordered lists
This example demonstrates different types of unordered lists.

Nested lists
This example demonstrates how to nest lists.

Nested list 2
This example demonstrates a more complex nested list.

Custom list
This example demonstrates a definition list.

HTML list tag

Label Description
<ol>
Define an ordered list
<ul>
Define an unordered list
<li>
Define list items
<dl>
Definition list
<dt>
Custom list items
<dd>
Define the description of a custom list item