Using Lists

Here for a change is a nice simple topic, adding lists to your web pages. There are two sorts of lists you can use:

  1. Numbered Lists, known in HTML as Ordered Lists
  2. Bullet Lists, known in HTML as Unordered Lists
The previous lines as you may have guessed form an Ordered List. The indentation of the list and the numbering of the lines is all handled for you automatically. This is what the HTML required to produce this list looks like:- 
<OL>
        <LI><B>Numbered Lists</B>, known in HTML as <B>Ordered Lists</B></LI>
        <LI><B>Bullet Lists</B>, known in HTML as <B>Unordered Lists</B></LI>
</OL>
Note how the overall list is contained by <OL> and </OL> tags, and each item in the list is contained by <LI> and </LI> tags. The </LI> tag is optional and serves no useful purpose, so it is almost always omitted. I included it here, simply to emphasise the structure of the list markup. The <B> and </B> tags, are not part of the list markup of course, they just embolden the words they enclose. Similarly the indentation and layout of the HTML has, as always, no effect on the appearance of the page. It is just done to make the structure clear.

The markup for an unordered list follows exactly the same structure. The only difference is that the tags enclosing the list are <UL> and </UL> rather than <OL> and </OL>. The individual list items still use the <LI> tag, just as for the ordered list.

You may add a little variety to your lists if you wish with the type attribute. For the ordered list, this may take the values "A","a","I","i" or "1". (Note that this is another of the rare cases, where the use of upper or lower case letters has significance). "1" produces the default numbered list. "A" and "a" produce lettered lists and "I" and "i" produce lists ordered with Roman numerals. Try them to see the effect.

For the unordered list, the type attribute may take the values, "disk", "circle" or "square" producing different shaped bullets. "disk" is the default, if no type is specified.

Lists may be nested if you wish, so that individual items in the outer list can themselves be lists. Any combination of ordered and unordered lists may be used. Experiment with a few combinations on your pages and see which ones you find useful.

Copyright © Alan Simpson 2000 Back to index. Forward to next page. Last Updated 2000-04-26