As the name itself suggests, all the list items are marked with numbers by default in a Numbered List. It is popularly known as HTML Ordered List and hence starts with the <ol> tag. The list items in an HTML Ordered List start with the <li> tag. An HTML Ordered List can be mainly of five types, depending on the different types of numbers or letters used for numbering the list items.
| TYPE | DESCRIPTION | VALUES | USES |
| Type “1” | Numeric Number | 1, 2, 3 | Default type. The list items are numbered with numbers. |
| Type “I” | Capital Roman Number | I, II, III | The list items are numbered with upper-case Roman numbers. |
| Type “i” | Small Romal Number | i, ii, iii | The list items are numbered with lowercase roman numbers. |
| Type “A” | Capital Alphabet | A, B, C | The list items are numbered with upper case letters. |
| Type “a” | Small Alphabet | a, b, c | The list items are numbered with lowercase letters. |
Type “1”
Example:
<!DOCTYPE html> <html> <body> <h2>HTML Ordered List or Numbered List</h2> <ol> <li>Name</li> <li>Age</li> <li>Address</li> </ol> </body> </html>
Explanation:
In the above example, we created an ordered or numbered list of the default type in HTML containing three items.
Type “I”
Example:
<!DOCTYPE html> <html> <body> <h2>HTML Ordered List or Numbered List</h2> <ol type="I"> <li>Name</li> <li>Age</li> <li>Address</li> </ol> </body> </html>
Explanation:
In the above example, we created an ordered or numbered list of Type “I” in HTML containing three items.
Type “i”
Example:
<!DOCTYPE html> <html> <body> <h2>HTML Ordered List or Numbered List</h2> <ol type="i"> <li>Name</li> <li>Age</li> <li>Address</li> </ol> </body> </html>
Explanation:
In the above example, we created an ordered or numbered list of Type “i” in HTML containing three items.
Type “A”
Example:
<!DOCTYPE html> <html> <body> <h2>HTML Ordered List or Numbered List</h2> <ol type="A"> <li>Name</li> <li>Age</li> <li>Address</li> </ol> </body> </html>
Explanation:
In the above example, we created an ordered or numbered list of Type “A” in HTML containing three items.
Type “a”
Example:
<!DOCTYPE html> <html> <body> <h2>HTML Ordered List or Numbered List</h2> <ol type="a"> <li>Name</li> <li>Age</li> <li>Address</li> </ol> </body> </html>
Explanation:
In the above example, we created an ordered or numbered list of Type “a” in HTML containing three items.
HTML Ordered List or Numbered List using START attribute:
Example:
<!DOCTYPE html> <html> <body> <h2>HTML Ordered List or Numbered List</h2> <ol type="a" start="10"> <li>Name</li> <li>Age</li> <li>Address</li> </ol> </body> </html>
Explanation:
In the above example, we created an ordered or numbered list of Type “a” in HTML containing three items. Here numbering of the list items started from the 10th letter in the alphabetical order which is “j”.
HTML Ordered List or Numbered List using REVERSED attribute:
The Reversed attribute is a Boolean attribute of the HTML ol tag, which is newly added in the HTML5 version. As the name suggests, this attribute is used to reverse the numbering of the list items.
Example:
<!DOCTYPE html> <html> <body> <h2>HTML Ordered List or Numbered List</h2> <ol reversed> <li>Name</li> <li>Age</li> <li>Address</li> </ol> </body> </html>
Explanation:
In the above example, we created an ordered or numbered list of the default type in HTML containing three items, but the order of numbering of the list items is reversed using the ‘reversed’ attribute.