How to create ordered list in HTML

HTML List

When we want to use a list on a website, HTML provides three different types to choose from: unordered, ordered, and description lists.
In this tutorial, you will learn how to create ordered list in HTML.

Ordered List


Ordered list start with <ol> tag. <li> tag to add list items to ordered or unordered list.
By default, list items are marked with numbers.

Syntax


<ol> <li>first</li> <li>second</li> <li>third</li> </ol>

Output will be:
  1. first
  2. second
  3. third
Ordered list have three attributes: type, start and reversed

Start Attribute


The start attribute defines the number from which an ordered list should start. By default, ordered lists start at 1. However, there may be cases where a list should start from another number. When we use the start attribute on the <ol> element, we can identify exactly which number an ordered list should begin counting from.

<ol start=11> <li>first</li> <li>second</li> <li>third</li> </ol>

Output will be:
  1. first
  2. second
  3. third

Type Attribute


The type attribute defines the type of numbering to use:

ValueDescription
1Numbers (default value)
IUppercase Roman numerals
iLowercase Roman numerals
AUppercase letters
aLowercase letters

<ol type="A"> <li>first</li> <li>second</li> <li>third</li> </ol>

Output will be:
  1. first
  2. second
  3. third

Reversed Attribute


Reversed attribute just reverse the order of the list's item.

<ol start=11 reversed> <li>first</li> <li>second</li> <li>third</li> </ol>

Output will be:
  1. first
  2. second
  3. third
For live demo, go though below Youtube video:

Comments

Popular Posts

How to Import and Export Delimited Files, like CSV, in PowerShell

PowerShell Arithmetic Operators

How to generate a GUID in PowerShell