D DevBrainBox

HTML5 Lists

HTML

What is a list in HTML5?

A list is a way to group related pieces of content together.

HTML5 supports three main types of lists:

  1. Ordered Lists (<ol>) – items are numbered (or lettered).
  2. Unordered Lists (<ul>) – items have bullet points.
  3. Description Lists (<dl>) – used for pairs of terms and descriptions (like a glossary).

1. Ordered List (<ol>)

Items are in a specific sequence.

Each item is marked with a number by default.

<ol>
  <li>First item</li>
  <li>Second item</li>
  <li>Third item</li>
</ol>

Output

  1. First item
  2. Second item
  3. Third item You can change the type of numbering (e.g. letters, roman numerals):
<ol type="A">
  <li>Item A</li>
  <li>Item B</li>
</ol>

2. Unordered List

Items have bullets.

No order implied.

<ul>
  <li>Apple</li>
  <li>Banana</li>
  <li>Cherry</li>
</ul>

Output

  • Apple
  • Banana
  • Cherry

You can change the bullet style with CSS (circle, square, etc.).

3. Description List

Used for terms and descriptions, like in dictionaries or FAQs.

Syntax:

<dl>
  <dt>HTML</dt>
  <dd>A markup language for creating web pages.</dd>
  <dt>CSS</dt>
  <dd>A style sheet language for designing web pages.</dd>
</dl>

HTML A markup language for creating web pages.

CSS A style sheet language for designing web pages.

On this page