HTML Lists

HTML Lists

HTML lists allow web developers to group related items in a structured and readable way.

Examples

An unordered HTML list:

<ul>   <li>Item</li>   <li>Item</li>   <li>Item</li>   <li>Item</li> </ul>

An ordered HTML list:

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

Unordered HTML List

An unordered list starts with the <ul> tag. Each list item starts with the <li> tag.

By default, list items are marked with bullet points.

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

Ordered HTML List

An ordered list starts with the <ol> tag. Each list item starts with the <li> tag.

By default, list items are marked with numbers.

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

HTML Description Lists

HTML also supports description lists.

A description list is a list of terms, with a description for each term.

The <dl> tag defines the list, the <dt> tag defines the term, and the <dd> tag describes the term.

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

Exercise

What is the correct tag name for list items?

<item> <list-item> <li>

HTML List Tags

Tag	Description
<ul>	Defines an unordered list
<ol>	Defines an ordered list
<li>	Defines a list item
<dl>	Defines a description list
<dt>	Defines a term in a description list
<dd>	Describes the term in a description list