HTML provides three different types of lists, each with their own set of list tags. These include:
- Ordered lists (
<ol>
): These are used to create numbered lists. The list items are automatically numbered in order, starting with 1.
Example code:
css<ol>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
</ol>
Output:
Item 1
Item 2
Item 3
Unordered lists (
<ul>
): These are used to create bulleted lists. The list items are marked with a bullet point or other marker.
Example code:
css<ul>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
</ul>
Output:
- Item 1
- Item 2
- Item 3
- Definition lists (
<dl>
): These are used to create a list of terms and their corresponding definitions.
Example code:
css<dl>
<dt>Term 1</dt>
<dd>Definition 1</dd>
<dt>Term 2</dt>
<dd>Definition 2</dd>
<dt>Term 3</dt>
<dd>Definition 3</dd>
</dl>
Output:
Term 1 Definition 1
Term 2 Definition 2
Term 3 Definition 3
Each list item in these lists is marked with a specific tag:
<li>
: This is used to define a list item in both ordered and unordered lists.<dt>
: This is used to define a term in a definition list.<dd>
: This is used to define the definition of a term in a definition list.
Note that you can also nest lists within each other to create more complex lists.
Example code:
css<ol>
<li>Item 1</li>
<li>Item 2
<ul>
<li>Subitem 1</li>
<li>Subitem 2</li>
</ul>
</li>
<li>Item 3</li>
</ol>
Output:
- Item 1
- Item 2
- Subitem 1
- Subitem 2
- Item 3