Syntax
<ol>
<li>First step</li>
<li>Second step</li>
</ol>Examples
Basic Numbered List
Step-by-step instructions using an ordered list.
<ol>
<li>Preheat the oven to 350°F</li>
<li>Mix the dry ingredients</li>
<li>Add wet ingredients and stir</li>
<li>Bake for 25 minutes</li>
</ol>Custom Start Number
Starting the list count from a specific number.
<ol start="5">
<li>Step five</li>
<li>Step six</li>
<li>Step seven</li>
</ol>Reversed and Custom Type
Counting down and using letters instead of numbers.
<ol reversed>
<li>Third place</li>
<li>Second place</li>
<li>First place</li>
</ol>
<ol type="A">
<li>Option A</li>
<li>Option B</li>
</ol>Attributes
- start (number): Sets the starting number of the list (default is 1)
- reversed (boolean): Numbers the list in descending order
- type (1 | A | a | I | i): Sets the numbering style: numbers, letters, or Roman numerals
Best practices
- Use <ol> whenever the sequence of items carries meaning, such as instructions or rankings
- Use the start attribute rather than manually numbering items in the text
- Reach for the reversed attribute for countdowns instead of reordering the markup
- Keep list item text parallel in structure and grammar for readability
At a glance
- Purpose
- Structure and meaning for web content
- File extension
- .html · .htm
- Runs in
- Web browsers
- Usually used with
- CSS and JavaScript
Specifications & further reading
Related HTML documentation
<ul>
The <ul> element represents an unordered list of items, typically displayed with bullet points. The order of items has no semantic meaning — use <ol> instead when sequence matters. Every item inside a <ul> must be wrapped in an <li> (list item) element. Unordered lists are commonly used for navigation menus, feature lists, and any collection of related items.<dl>, <dt>, <dd>
The description list group represents a list of term/description pairs — like a glossary or metadata list. <dl> wraps the whole list, <dt> defines each term, and <dd> defines its associated description. Unlike <ul>/<ol>, description lists are not bulleted or numbered by default.<menu>
The <menu> element is a semantic alternative to <ul>, intended specifically for lists of commands or interactive items — like a toolbar or context menu — rather than plain content lists. Browsers currently render it identically to <ul>, but it signals different intent to assistive technology and future tooling.<li>
The <li> element represents an individual item within a list — <ul>, <ol>, or <menu>. Its rendering depends on its parent: inside <ol>, browsers add sequential numbering; inside <ul>, they add bullet points. The value attribute lets you override an item's number specifically within an ordered list.
The <ul> element represents an unordered list of items, typically displayed with bullet points. The order of items has no semantic meaning — use <ol> instead when sequence matters. Every item inside a <ul> must be wrapped in an <li> (list item) element. Unordered lists are commonly used for navigation menus, feature lists, and any collection of related items.<dl>, <dt>, <dd>
The description list group represents a list of term/description pairs — like a glossary or metadata list. <dl> wraps the whole list, <dt> defines each term, and <dd> defines its associated description. Unlike <ul>/<ol>, description lists are not bulleted or numbered by default.<menu>
The <menu> element is a semantic alternative to <ul>, intended specifically for lists of commands or interactive items — like a toolbar or context menu — rather than plain content lists. Browsers currently render it identically to <ul>, but it signals different intent to assistive technology and future tooling.<li>
The <li> element represents an individual item within a list — <ul>, <ol>, or <menu>. Its rendering depends on its parent: inside <ol>, browsers add sequential numbering; inside <ul>, they add bullet points. The value attribute lets you override an item's number specifically within an ordered list.