Text and meaning
Lists
Use unordered, ordered, and description lists to group related items and communicate whether their sequence matters.
6 minute lesson
~~~
Use an unordered list when the order of its items does not matter:
<ul>
<li>Helmet</li>
<li>Water bottle</li>
<li>Repair kit</li>
</ul>
ul means unordered list. Each item is an li element.
Use an ordered list when the sequence matters:
<ol>
<li>Check the tires</li>
<li>Adjust the seat</li>
<li>Test the brakes</li>
</ol>
The browser numbers ordered-list items by default. The numbers are useful, but the semantic fact that order matters is even more important.
Description lists pair terms with descriptions:
<dl>
<dt>Cycle track</dt>
<dd>A path reserved for bicycles.</dd>
<dt>Bike lane</dt>
<dd>A marked part of a road for bicycles.</dd>
</dl>
You can nest a list inside a list item. Keep the nesting visible with consistent indentation.
Quick check
Result
You got of right.
Lesson completed