Tag Description
<ol> The HTML <ol> tag is used for specifying an ordered list.

Ordered lists are used in situations where items on the list have some order to them. The result is each item is listed in order, and has some identifier marker. These may be more commonly known as numbered lists. Examples include lists of priorities, lists of process steps etc.

Examples

Type HTML Code Display
Simple list

<ol> 
    <li>Coffee</li>
    <li>Tea</li> 
    <li>Milk<li> 
</ol>
                
  1. Coffee
  2. Tea
  3. Milk
Simple list
 
<ol class="
afsc-list-normal">
<li>Coffee</li>
<li>Tea</li>
<li>Milk<li>
</ol>
  1. Coffee
  2. Tea
  3. Milk
Nested List

<ol> 
    <li>Coffee</li>
    <li>Tea
        <ol>
            <li>Black Tea</li>
            <li>Green Tea</li>
        </ol>
    </li> 
    <li>Milk</li>
</ol>
                
  1. Coffee
  2. Tea
    1. Black Tea
    2. Green Tea
  3. Milk
Nested List
 
<ol
class="afsc-list-normal">
<li>Coffee</li>
<li>Tea
<ol
class="afsc-list-normal">
<li>Black Tea</li>
<li>Green Tea</li>
</ol>
</li>
<li>Milk</li>
</ol>
  1. Coffee
  2. Tea
    1. Black Tea
    2. Green Tea
  3. Milk
Complex Ordered List

<ol>
    <li>Coffee</li>
    <li>Tea
        <ol>
            <li>Black Tea</li>
            <li>Green Tea
                <ol> 
                    <li>Africa</li>
                    <li>China</li>
                </ol>
            </li>
        </ol>
    </li> 
    <li>Milk</li>
</ol>
                
  1. Coffee
  2. Tea
    1. Black Tea
    2. Green Tea
      1. Africa
      2. China
  3. Milk
Complex Ordered List
 
<ol
class="afsc-list-normal">
<li>Coffee</li>
<li>Tea
<ol
class="afsc-list-normal">
<li>Black Tea</li>
<li>Green Tea
<ol
class="afsc-list-normal">
<li>Africa</li>
<li>China</li>
</ol>
</li>
</ol>
</li>
<li>Milk</li>
</ol>
  1. Coffee
  2. Tea
    1. Black Tea
    2. Green Tea
      1. Africa
      2. China
  3. Milk