HTML <ol> Tag
Example
2 different ordered lists:
<ol>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol>
<ol start="50">
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol>
Try it yourself »
Definition and Usage
The <ol> tag defines an ordered list. An ordered list can be numerical or alphabetical.
Use the <li> tag to define list items.
Browser Support
| Element | ||||||
|---|---|---|---|---|---|---|
| <ol> | Yes | Yes | Yes | Yes | Yes | Yes |
Tips and Notes
Tip: For unordered list, use the <ul> tag.
Tip: Use CSS to style lists.
Differences Between HTML 4.01 and HTML5
The "start" and "type" attributes were deprecated in HTML 4.01, but IS supported in HTML5.
The "reversed" attribute is new in HTML5.
The "compact" attribute is not supported in HTML5.
Attributes
= New in HTML5.
| Attribute | Value | Description |
|---|---|---|
| compact | compact | Not supported in HTML5. Specifies that the list should render smaller than normal |
| reversed | reversed | Specifies that the list order should be descending (9,8,7...) |
| start | number | Specifies the start value of an ordered list |
| type | 1 A a I i |
Specifies the kind of marker to use in the list |
Global Attributes
The <ol> tag also supports the Global Attributes in HTML.
Event Attributes
The <ol> tag also supports the Event Attributes in HTML.
Related Pages
HTML tutorial: HTML Lists
HTML DOM reference: Ol Object
CSS Tutorial: Styling Lists
Default CSS Settings
Most browsers will display the <ol> element with the following default values:
Example
ol {
display: block;
list-style-type: decimal;
margin-top: 1em;
margin-bottom: 1em;
margin-left: 0;
margin-right: 0;
padding-left: 40px;
}
Try it yourself »
