HTML Ordered Lists

[Guest]

HTML Ordered Lists


The HTML <ol> tag defines an ordered list. An
ordered list can be numerical or alphabetical.

Ordered HTML List
An ordered list starts with the <ol> tag. Each list item starts with the <li> tag.
The list items will be marked with numbers by default:

Example

<ol>
 
<li>Coffee</li>  <li>Tea</li>
 
<li>Milk</li>
</ol>

Try it Yourself »


Ordered HTML List - The Type Attribute
The type attribute of the <ol> tag, defines the type of the
list item marker:


Type
Description


type="1"
The list items will be numbered with numbers (default)


type="A"
The list items will be numbered with uppercase letters


type="a"
The list items will be numbered with lowercase letters


type="I"
The list items will be numbered with uppercase roman numbers


type="i"
The list items will be numbered with lowercase roman numbers



Numbers:

<ol type="1">  <li>Coffee</li>
  <li>Tea</li>  <li>Milk</li></ol>

Try it Yourself »


Uppercase Letters:

<ol type="A">  <li>Coffee</li>
  <li>Tea</li>  <li>Milk</li></ol>

Try it Yourself »


Lowercase Letters:

<ol type="a">  <li>Coffee</li>
  <li>Tea</li>  <li>Milk</li></ol>

Try it Yourself »


Uppercase Roman Numbers:

<ol type="I">  <li>Coffee</li>
  <li>Tea</li>  <li>Milk</li></ol>

Try it Yourself »


Lowercase Roman Numbers:

<ol type="i">  <li>Coffee</li>
  <li>Tea</li>  <li>Milk</li></ol>

Try it Yourself »








Control List Counting
By default, an ordered list will start counting from 1. If you want to start counting from a specified number, you can use the start attribute:

Example

<ol start="50">  <li>Coffee</li>  <li>Tea</li> 
<li>Milk</li></ol>
Try it Yourself »


Nested HTML Lists
Lists can be nested (list inside list):

Example

<ol>  <li>Coffee</li>  <li>Tea
    <ol>     
<li>Black tea</li>      <li>Green tea</li>
    </ol> 
</li>  <li>Milk</li></ol>

Try it Yourself »


Note: A list item (<li>) can contain
a new list, and other HTML elements, like images and links, etc.


Chapter Summary

Use the HTML <ol> element to define an ordered list
Use the HTML type attribute to define the numbering type
Use the HTML <li> element to define a list item
Lists can be nested
List items can contain other HTML elements


HTML List Tags


Tag
Description


<ul>
Defines an unordered list


<ol>
Defines an ordered list


<li>
Defines a list item


<dl>
Defines a description list


<dt>
Defines a term in a description list


<dd>
Describes the term in a description list



For a complete list of all available HTML tags, visit our HTML Tag Reference.













★
+1

Reference: https://www.w3schools.com/html/html_lists_ordered.asp