HTML Lists: Unordered, Ordered, and Description Lists

Learn how to create effective and semantic lists in HTML using `<ul>`, `<ol>`, and `<dl>` tags. This tutorial shows you how to structure unordered lists (bulleted), ordered lists (numbered), and description lists for improved readability and website organization.

Creating Lists in HTML

Understanding HTML Lists

HTML provides several ways to create lists to organize and present related items. This makes it easier for users to scan and understand information on your webpage.

Unordered Lists

Unordered lists use bullets to mark list items. They're created using the <ul> (unordered list) tag and <li> (list item) tags.

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

Ordered Lists

Ordered lists use numbers to mark list items. They're created using the <ol> (ordered list) tag and <li> tags.

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

Description Lists

Description lists are used to present terms and their descriptions. They use the <dl> (description list), <dt> (description term), and <dd> (description definition) tags.

<dl>
  <dt>Coffee</dt>
  <dd>A hot drink</dd>
  <dt>Milk</dt>
  <dd>A cold drink</dd>
</dl>