|
|
There are 3 kinds of lists in HTML currently. They each look a bit different, and can do different things.
The first is the Unnumbered list that is started by a <UL>, this list is a rather simple bulleted list. You start with the <UL> and then you may add each of your list items with an <LI> before them. This <LI> is the HTML code for the bullet. All lists need to be closed after they are done. You do this using the </UL>command. By adding TYPE to the <UL> tag (<UL TYPE=SQUARE>), you may set the type of bullets to be used. The possible types are:
<html>
<head>
<title>Unnumbered Lists - Example</title>
</head>
<body>
<h1>An Unnumbered List</h1>
<UL>
<LI> Shirts
<LI> Pants
</UL>
</body>
</html>
The second kind of list is the Numbered (or Ordered) List. This is just as simple as the last list, but in this case you will get your entries numbered instead of bulleted. The HTML code for a number is the same as that for a bullet <LI>. But this list is started with an <OL> instead. Don't forget you still have to close the list with the </OL>. By adding TYPE to the <OL> tag (<OL TYPE=i>), you may set the type of numbers to be used. The possible types are:
<html>
<head>
<title>Numbered Lists - Example</title>
</head>
<body>
<h1>A Numbered List</h1>
<OL>
<LI> Shirts
<LI> Pants
<LI> Shoes
</OL>
</body>
</html>
The last type of list is the Definition List. In this list you
have a word or phrase, and a definition that is tabbed in below or next to it
(depending on the HTML reader). This list is opened with the <DL> tag.
The mark for the word being defined is <DT>, the mark for the
text that goes with it is <DD>. If your terms are very short you may add
the COMPACT attribute to the <DL> (<DL COMPACT>). This may allow
the term to fit on the same line as the start of the definition.
Here is an example:
<html>
<head>
<body>
<title>Definition Lists - Example</title>
</head>
<h1>A Definition List</h1>
<DL>
<DT> Shirts
<DD> They go on your torso.
<DT> Pants
<DD> They go on your legs.
<DT> Shoes
<DD> They go on your feet.
</DL>
</body>
</html>
You can also nest lists, but notice that the bullets will change unless you set them using the type command.
<html>
<head>
<title>Nested Lists - Example</title>
</head>
<body>
<h1>A Nested List</h1>
<UL>
<LI> Shirts
<UL>
<LI> Dress Shirts
<LI> Polo Shirts
</UL>
<LI> Pants
</UL>
</body>
</html>
The next section will describe how to make your text look different on the screen.
The National Center for Supercomputing Applications
University of Illinois at Urbana-Champaign
[email protected]
Last modified: June 19, 1997