Lists

List are a practical and simple method for ordering information.

Unordered list

The UL element, an unordered list, shows items with just a plain bullet before them. Every item in the list starts with the LI (list item) element. You can close each list item with an </LI> tag but this is not obligatory:

<UL>
<LI>Dog</LI>
<LI>Cat</LI>
<LI>Cow</LI>
</UL>

Both the UL and LI element can take the attribute TYPE. This can take the values of "disc", "circle" or "square". If you include this attribute in the UL element, it will affect the whole list. If you include it in an LI element, the attribute will affect that item only:

<UL>
<LI STYLE="list-style-type:disc">Dog
<LI STYLE="list-style-type:circle">Cat
<LI STYLE="list-style-type:square">Cow
<LI>Snake
</UL>

As you can see from these two examples, the default for TYPE is "disc". The TYPE attribute has been deprecated, in favour of style sheets.

Ordered list

In the ordered list each item gets a number, automatically. The items are also indented. Each item should start with the LI element. Ordered lists look like this:

<OL>
<LI>Train
<LI>Airplane
</OL>

The result is almost the same as an unordered list, except that in the unordered list the items do not get a number but a bullet before them.

Both the OL and the LI element can be assigned different styles. If you put the TYPE attribute in the <OL> tag is influences the whole list, it you put it in the <LI> tag, it affects that item only.

<OL STYLE="list-style-type:hebrew">
<LI>Bogart
<LI STYLE="list-style-type:decimal-leading-zero">Reynolds
<LI STYLE="list-style-type:lower-roman">Bergman
<LI STYLE="list-style-type:decimal">Hoffman
<LI STYLE="list-style-type:upper-roman">Bacall
<LI STYLE="list-style-type:georgian">Caine
<LI STYLE="list-style-type:armenian">Pacino
<LI STYLE="list-style-type:cjk-ideographic">Quaid
<LI STYLE="list-style-type:hiragana">Goodman
<LI STYLE="list-style-type:katakana">McQueen
<LI STYLE="list-style-type:hiragana-iroha">Welles
</OL>

You will probably see that your browser does not recognise all the different ways of numbers. Normally, the ones not recognised will be replaces by normal, decimal numbering.

Definition lists

A definition list (also referred to as glossary list) has elements that consist of two parts: a term and its definition. For example:

<DL>
<DT>A Cat
<DD>A furry, four-legged animal
<DT>A Snake
<DD>A legless thing that slithers on the ground
</DL>

DD and DT elements may end with a </DD> and </DT> tag respectively but this is optional. Also, you can have more than one term followed by more than one definition:

<DL>
<DT>Car</DT>
<DT>Automobile</DT>
<DD>A four-wheeled passenger car</DD>
<DD>General term for motorised vehicles</DD>
</DL>

Nested lists

It is possible to put lists within lists:

<OL>
<LI>Train
  <UL>
  <LI>Intercity
  <LI>Regional
  <LI>Local
  </UL>
<LI>Airplane
<LI>Boat
<LI>Car
</OL>

With nested lists you can use all the options and attributes mentioned in this chapter.