HTML <ol> Element
The HTML <ol> element represents an ordered list of items where the sequence or position of each item is meaningful.
Syntax
<ol>
<li>First item</li>
<li>Second item</li>
<li>Third item</li>
</ol>The <ol> element requires both an opening and closing tag. Each item in the ordered list is represented by an <li> element.
Attributes
The <ol> element supports the global HTML attributes and the following element-specific attributes:
| Attribute | Description |
|---|---|
reversed |
Reverses the numbering so the list counts downward instead of upward. |
start |
Specifies the ordinal value of the first list item. |
type |
Specifies the type of marker used for the list, such as numbers, letters, or Roman numerals. |
Example
This example uses an <ol> element to create a numbered list where the order of the steps is important.
Usage Notes
Use the <ol> element when changing the order of the list items would change their meaning or make the information harder to understand. Common examples include instructions, rankings, procedures, and sequences of events.
Use the start attribute when the first item should begin with an ordinal value other than 1. The reversed attribute can be used when the list should count downward.
The type attribute can change the list marker to decimal numbers, lowercase or uppercase letters, or lowercase or uppercase Roman numerals. CSS can also be used when additional control over the appearance of list markers is needed.
If the order of the items is not meaningful, use the <ul> element instead.
Accessibility
Use an ordered list when the sequence of items carries meaning. The list structure allows assistive technologies to identify the content as a list and communicate information about its items to users.
Avoid removing list semantics when changing the visual appearance with CSS. If visible markers are removed, make sure users can still understand the sequence when the order of the items is important.
Browser Support
Baseline: Widely available indicates a feature has been supported by core browsers for at least 30 months. At this stage, the feature is considered stable and safe for most websites to use without needing to worry about compatibility issues or fallbacks, as it is supported by the vast majority of users' devices and browser versions.
For detailed browser compatibility information, see Can I Use: HTML <ol> Element .
Related Elements
The <ol> element is closely related to the <li> element for individual list items, the <ul> element for unordered lists, and the <menu> element for lists of commands or controls.