HTML · Chapter 19 of 45
HTML Lists
HTML supports ordered lists (<ol>, numbered), unordered lists (<ul>, bulleted), and description lists (<dl>, for term-definition pairs). List items in ol/ul use the <li> tag.
Lists can be nested inside each other to create sub-lists, which is common for navigation menus and outlines.
Syntax
<ul><li>Item</li></ul>Ordered vs unordered
<ul> creates bullet points, ideal when order doesn't matter. <ol> creates numbered items, ideal for sequences or ranked items.
Description lists
<dl> pairs <dt> (term) with <dd> (definition), useful for glossaries, FAQs, or metadata displays.
Example 1 (html)
<ul>
<li>Apples</li>
<li>Bananas</li>
</ul>Output
• Apples
• BananasAn unordered (bulleted) list of two items.
Example 2 (html)
<ol>
<li>Preheat oven</li>
<li>Mix ingredients</li>
</ol>Output
1. Preheat oven
2. Mix ingredientsAn ordered list numbers items automatically.
Key points
- <ul> is for unordered (bulleted) lists.
- <ol> is for ordered (numbered) lists.
- <li> defines each list item.
- <dl>/<dt>/<dd> create term-definition description lists.
💡 Note: Lists can be nested by placing a full <ul> or <ol> inside an <li>.