HTML Encyclopaedia

The ol tag

<ol>
list items
</ol>

Here is an example of nested numbered lists.

1. List level 1
2. List level 1 - second item
3. List level 1 - third item
   1. List level 2 - first item
   2. List level 2 - second item
      1. List level 3 - first item
      2. List level 3 - second item
   3. List level 2 - third item
      1. Second level 3 list - item A
      2. Second level 3 list - item B
         1. the only item in a level 4 list
   4. List level 2 - fourth item
4. List level 1 - last item

Attributes of the <ol> tag

There are three attributes associated with the <ol> tag.

1. type

   The value of this attribute controls the style of item numbering. The following values are understood.

   1. a

      This value gives a list in which the items are labelled using lower case letters such as "a", "b", "c" etc. Here is an example.

      1. First item
      2. Second item
      3. Third item

      If the attribute value "A" is given then the list items will be labelled using upper case letters.

   2. i

      This value gives a list in which the items are labelled using lower case Roman numerals such as "i", "ii", "iii" etc. Here is an example.

      1. First item
      2. Second item
      3. Third item

      The value "I" will give upper case Roman numerals thus

      1. First item
      2. Second item
      3. Third item

   3. 1

      This value gives a list in which the items are labelled using decimal numbers. This is the default.

2. start

   The value of this attribute is used to control the "origin" of the numbering of list items. It should always be a decimal integer irrespective of the value of the type attribute.

   Here is an example of list with the numbering starting at 7.

   7. First item
   8. Second item
   9. Third item

   Changing the type to "a" gives the following list

   7. First item
   8. Second item
   9. Third item

   If you examine the HTML you'll see that the value of the start attribute always has to be specified in decimal even for lists of one of the other styles, so, if you want to start a type=a list at e you'll have to remember that e is the fifth letter of the alphabet.

3. compact

   This little-known attribute is mentioned in the HTML 3.2 standard as indicating that the list should be rendered "in a more compact style". The standard gives no further clues. Here's a simple ordered list

   1. Alberta
   2. British Columbia
   3. Manitoba
   4. New Brunswick
   5. Newfoundland
   6. North West Territories
   7. Nova Scotia
   8. Ontario
   9. Prince Edward Island
   10. Québec
   11. Saskatchewan
   12. Yukon Territory

   Here's exactly the same list with the compact attribute

   1. Alberta
   2. British Columbia
   3. Manitoba
   4. New Brunswick
   5. Newfoundland
   6. North West Territories
   7. Nova Scotia
   8. Ontario
   9. Prince Edward Island
   10. Québec
   11. Saskatchewan
   12. Yukon Territory
   You probably won't see any difference.

Browsers

MOS3 does not honour the type or start attributes and produces a much more modest amount of indentation than the other browsers.

There is an interesting difference between the rendering these lists between NN3 and IE3. The following extract from the list immediately above shows the difference, it's here rendered in pre-formatted text style so you can see exactly what happens.

1. IE3

             9. Prince Edward Island
             10.   Québec
   

2. NN3

             9. Prince Edward Island
            10. Québec
   

There is no doubt that the NN3 style is more attractive. IE3's sudden intrusion of extra spaces between the numbers and the list element is visually disconcerting. IE4 resolves the problem adopting the layout style used by NN3.