:: code war·ri·or                    
                   

Numbered Lists

There are virtually no differences between numbered and unordered (bulleted) lists. In fact, the only difference is one letter.

To make the bullet point list into a numbered list, just change UL to OL.

<OL>
<LI>List Item 1</LI>
<LI>List Item 2</LI>
<LI>List Item 3</LI>
<LI>List Item 4</LI>
</OL>

  1. List Item 1
  2. List Item 2
  3. List Item 3
  4. List Item 4

Numbered Lists

Where numbered lists differ is that they're much more versatile. For example, say you want to start your list at a number other than 1. Just use the START attribute of OL with the number to start from:

<OL START="5">
<LI>List Item 1</LI>
<LI>List Item 2</LI>
<LI>List Item 3</LI>
<LI>List Item 4</LI>
</OL>

  1. List Item 1
  2. List Item 2
  3. List Item 3
  4. List Item 4

You can also skip out some numbers partway through the list if you need to by putting the VALUE attribute in one of your LI tags:

<OL START="5">
<LI>List Item 1</LI>
<LI>List Item 2</LI>
<LI VALUE="10">List Item 3</LI>
<LI>List Item 4</LI>
</OL>

  1. List Item 1
  2. List Item 2
  3. List Item 3
  4. List Item 4

At the moment you may not see why you'd ever want to mess with the numbering like this, but it could be very useful especially when you start using nested lists.

You can also change the way the list appears - instead of numbers you can have letters or Roman numerals (capital or lower case). This is controlled with the TYPE attribute of the OL tag - the possible values are "a", "A", "i", "I" and "1" (the default and therefore does not need to be specified).

<OL TYPE="a">
<LI>List Item 1</LI>
<LI>List Item 2</LI>
<LI>List Item 3</LI>
<LI>List Item 4</LI>
</OL>

  1. List Item 1
  2. List Item 2
  3. List Item 3
  4. List Item 4

Nested Numbered Lists

These work in exactly the same way as nested unnumbered lists. Here's where that number changing might become useful:

<OL TYPE="A">
<LI>List Item 1</LI>
<LI>List Item 2</LI>

<P></P>

<OL START="3" TYPE="a">
<LI>List Item 1</LI>
<LI>List Item 2</LI>
<LI>List Item 3</LI>
<LI>List Item 4</LI>
</OL>

<P></P>

<LI VALUE="7">List Item 3</LI>
<LI>List Item 4</LI>
</OL>

  1. List Item 1
  2. List Item 2
    1. List Item 1
    2. List Item 2
    3. List Item 3
    4. List Item 4

  3. List Item 3
  4. List Item 4

Before we leave lists completely, let's move onto definition lists.


· code-warrior
· HTML Tutorials
· LISTS


Quick Links
· List Basics
· Numbered Lists
· Definition Lists



SHOP
· Books @ Amazon
· Software @ Amazon

Please send any comments to
This HTML guide is a free resource
© Code Warrior 2002

  

:: made on a mac