HTML Lists

HTML lists allow web developers to group related items together in an organized way.

Unordered HTML List

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

<ul>
   <li>Apple</li>
   <li>Banana</li>
   <li>Milk</li>
</ul>

Items are displayed with bullet points by default.

Ordered HTML List

An ordered list starts with the <ol> tag. Each item is displayed with numbers by default.

<ol>
   <li>Good</li>
   <li>Better</li>
   <li>Best</li>
</ol>

Nested Lists

Lists can be placed inside other lists to create sub-items.

<ul>
   <li>Item 1
      <ul>
         <li>Subitem 1.1</li>
         <li>Subitem 1.2</li>
      </ul>
   </li>

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

Description List

A description list contains terms and their descriptions.

<dl>
   <dt>Coffee</dt>
   <dd>Black hot drink</dd>

   <dt>Milk</dt>
   <dd>White cold drink</dd>
</dl>

List Tags

<ul>

Creates an unordered list.

<ol>

Creates an ordered list.

<li>

Creates a list item.

<dl>

Creates a description list.

<dt>

Defines a term in a description list.

<dd>

Defines the description of a term.

Key Points

• HTML supports ordered and unordered lists.
• <li> is used for list items.
• Nested lists create sub-items.
• Description lists use <dl>, <dt> and <dd>.
• Lists improve readability and organization.
• Lists are commonly used for menus and navigation.