HTML Lists

HTML lists are used to represent a group of related items in a structured way. There are two types of lists in HTML: ordered lists and unordered lists.

Ordered lists

An ordered list is a list of items in which the order of the items is important. The items in an ordered list are usually represented by numbers.

To create an ordered list in HTML, you use the <ol> element, which stands for "ordered list," and the <li> element, which stands for "list item." The <li> element is used to represent each item in the list.

Here is an example of an ordered list in HTML:

<ol>
  <li>Item 1</li>
  <li>Item 2</li>
  <li>Item 3</li>
</ol>

This will render as:

  1. Item 1
  2. Item 2
  3. Item 3

Unordered lists

An unordered list is a list of items in which the order of the items is not important. The items in an unordered list are usually represented by bullet points. To create an unordered list in HTML, you use the <ul> element, which stands for "unordered list," and the <li> element as before.

Here is an example of an unordered list in HTML:

<ul>
  <li>Item 1</li>
  <li>Item 2</li>
  <li>Item 3</li>
</ul>

This will render as:

  • Item 1
  • Item 2
  • Item 3

HTML Description Lists

HTML description lists are used to represent a list of terms and their corresponding descriptions. The terms are represented by the <dt> element (stands for "definition term"), and the descriptions are represented by the <dd> element (stands for "definition description").

To create a description list in HTML, you use the <dl> element, which stands for "definition list," and then nest the <dt> and <dd> elements inside it.

Here is an example of a description list in HTML:

<dl>
  <dt>Term 1</dt>
  <dd>Description 1</dd>
  <dt>Term 2</dt>
  <dd>Description 2</dd>
  <dt>Term 3</dt>
  <dd>Description 3</dd>
</dl>

This will render as:

Term 1
Description 1
Term 2
Description 2
Term 3
Description 3

HTML List Tags

There are several HTML tags that can be used to create lists:

<ol> :

This stands for "ordered list" and is used to create a list of items in which the order of the items is important. The items in an ordered list are usually represented by numbers.

<ul> :

This stands for "unordered list" and is used to create a list of items in which the order of the items is not important. The items in an unordered list are usually represented by bullet points.

<li> :

This stands for "list item" and is used to represent each item in a list. It is nested within either an <ol> element (for an ordered list) or a <ul> element (for an unordered list).

<dl> :

This stands for "definition list" and is used to create a list of terms and their corresponding descriptions.

<dt> :

This stands for "definition term" and is used to represent the term in a definition list.

<dd> :

This stands for "definition description" and is used to represent the description of a term in a definition list.

HTML Basics