The List Tag Group is a group of tags that are used to define lists of data items.
A list is a sequential display of related items.
HTML supports 3 list types: unordered lists, ordered lists, and datalists.
Each of these list types have their own tags.
Here are the tags that are available to design HTML lists.
| Element | Description |
|---|---|
| <ul> | Creates an unordered, bulleted list |
| <ol> | Creates a numerically or alphabetically ordered list |
| <li> | Defines a list item. Used in <ol> and <ul> elements |
| <dl> | Defines a description list |
| <dt> | Adds a term or name to a <dl> element |
| <dd> | Adds a description of a term or name to a <dl> element |
Different list types: <ul>, <ol>, and <dl>.
<h5>Unordered list</h5>
<ul>
<li>Vincent Van Gogh</li>
<li>Paul Cézanne</li>
<li>Claude Monet</li>
</ul>
<h5>Ordered list</h5>
<ol>
<li>Amsterdam</li>
<li>London</li>
<li>Berlin</li>
<li>Paris</li>
</ol>
<h5>Description list</h5>
<dl>
<dt>National Gallery of Art</dt>
<dd>Washington DC, USA</dd>
<dt>Musée d'Orsay</dt>
<dd>Paris, France</dd>
<dt>Kunstmuseum</dt>
<dd>Basel, Switzerland</dd>
</dl>
The <ul> tag creates an unordered list with bullet points.
The <ol> tag creates an ordered list. This list is numeric.
The <li> tags define list items in both <ul> and <ol> elements.
The <dl>, <dt>, and <dd> tags together create a description list.
Tip: The <ul> and <ol> list types are widely used. The <dl> type not so much.
Different markers are availabe for items in <ul> and <ol> lists.
The items in a <ul> can have dots, circles, squares, or can be a custom image.
Items in an <ol> can be numeric, latin, and alphabetical, even in reverse order, etc.
