Lists

Your favourite pubs, ingredients for banana-hazelnuts cake and other things are best put into lists. HTML has provisions for various kinds of lists. There are:

<DIR>...</DIR>		       directory list

The <DIR> tag is used for lists consisting of short elements. Not more than 20 characters per element are recommended, as the list may be arranged by the browser in several columns. Each entry in the list is preceded with the <LI> tag:

  The files available are:
  <DIR>
   <LI>wakeup.zip
   <LI>sleepnow.zip
   <LI>overslpt.zip
   <LI>tired.zip
  </DIR>

The files available are:

wakeup.zip

sleepnow.zip

overslpt.zip

tired.zip

<MENU>...</MENU> 	       menu listing

This tag defines a menu listing. Also here, the different entries in the list are marked with a <LI> tag.

  Today's menu:
  <MENU>
   <LI>Open File
   <LI>Save File
   <LI>Save File As
   <LI>Exit
  </MENU>

Today's menu:

Open File

Save File

Save File As

Exit

<OL>...</OL>		       ordered list

In an ordered list, each entry in the list is given a continuous number. This can be a digit, a letter or even a Roman numeral. The kind of numbering is defined by parameters to the <OL> tag:

  TYPE="1|a|A|i|I" 	     type of numbering

A type of "1" uses numbers for list items, "a" defines small and "A" capital letters, where "i" uses small and "I" large Roman numerals.

  START="starting value"	     starting value

with the START parameter, the starting value of the list can be set to something other than "1", "a" or "I".

Also for the <OL> tag, individual elements in the list are preceded with the <LI> tag.

  The lessons up to now:
  <OL TYPE="1" START="1">
   <LI>The Basics
   <LI>Graphics
   <LI>Colours
   <LI>Tables
   <LI>Lists
  </OL>

The lessons up to now:

1. The Basics
2. Graphics
3. Colours
4. Tables
5. Lists

<UL>...</UL>		       unordered lists

The <UL> tag basically behaves the same as <OL>. It is just that the entries are not given a continuous number; instead special signs are used:

  TYPE="disk|square|circle"     type of bullets

With the TYPE parameter, you can chose whether you want to have solid disks, squares or open circles as bullets.

And yes, also with the unordered list, individual entries are separated by <LI>.

  Today's special: HTML'ers plate
  <UL TYPE="circle">
   <LI>Miso Soup
   <LI>Fried Shrimps
   <LI>Tempura
   <LI>Green Tea
  </UL>

Today's special: HTML'ers plate

• Miso Soup
• Fried Shrimps
• Tempura
• Green Tea

<DL>...</DL>		       definition list

A definition list is used for defining terms. Each definition is made up of two tags, <DT> (Definition Term) and <DD> (Definition Description).

  <DT> 			 definition term

Precede the term you want to describe with the <DT> tag and...

  <DD> 			 definition description

...the actual description should be preceded with a <DD> tag, such as:

  <DL>
   <DT>miso
    <DD>soya bean paste
   <DT>natto
    <DD>fermented soya beans
   <DT>shoyu
    <DD>soya sauce
  </DL>

miso

soya bean paste

natto

fermented soya beans

shoyu

soya sauce

Lists are easy to use and a good layout tool. Use them to make your pages easily readable. Especially Definition Lists, with their automatic indenting can be very useful.

© Algorithmica Japonica Copyright Notice: Copyright of material rests with the individual author. Articles may be reprinted by other user groups if the author and original publication are credited. Any other reproduction or use of material herein is prohibited without prior written permission from TPC. The mention of names of products without indication of Trademark or Registered Trademark status in no way implies that these products are not so protected by law.