What types of lists are available in HTML? There are three types
UNORDERED (bulleted) LISTS
ORDERED (numbered) LISTS
What is an UNORDERED (bulleted) LIST? An unordered list is used for a
collection of related items, where the order that the items are listed is
unimportant. The required structure is illustrated below: "UL" stands for "Unordered List"
and "LI" stands for "List Item" (or "LIst"). Typically, list items are displayed
indented, with a bullet preceding each item. (See the example in the
<LI> Each individual item gets its own "LI" tag.</LI>
<LI> Don't omit the closing tag!</LI>
CHANGING THE BULLET SHAPE (8b)
Can I change the bullet shape? If you don't specify the bullet shape, then it's determined by the
browser. The "disc" is the usual default: that is, if you don't specify a different
shape, then you'll get the disc. You can also get a "square" or a "circle":
Use the TYPE attribute within the <UL> tag to change the shape for ALL the list items:
Or, use the TYPE attribute within a <LI> tag to change the shape
for a particular list item:
The value for the attribute (disc, square, circle) MUST be all
ORDERED LISTS (8c)
What is an ORDERED (numbered) LIST? An ordered list is used when
the order that the items are listed is important. The structure is the same
as for unordered lists, except that you use "OL" (for "Ordered List") instead of "UL."
Can I change the "numbering" scheme? Use the TYPE attribute
to change the "numbering" scheme: <OL TYPE=?>
(I've used an ordered list below.)
TYPE=1 (numbers) is the default
TYPE=A gives uppercase letters
TYPE=a gives lowercase letters
TYPE=I gives uppercase roman letters
TYPE=i gives lowercase roman letters
Can I change the starting "number" in the list? <OL START=23>
<LI> Sure! Use the START attribute inside the "OL" tag.</LI>
<LI> Here, the first item would be 23.</LI>
DEFINITION LISTS (8d)
What is a DEFINITION LIST? A definition list consists of term/definition
pairs, as in a glossary. The structure is shown below.
Here, "DL" is for "Definition List"; "DT" is for "Definition Term";
"DD" is (maybe?) for "Definition Definition."
<DT> Term #1</DT>
<DD> Definition for Term #1</DD>
<DT> Term #2</DT>
<DD> Definition for Term #2</DD>
The output would look like this:
(A8.5) Make Item #1 a disc; Item #2 a square; Item #3 a circle.
(A8.6) Make the list an ordered list.
(A8.7) Start the numbering at 100 rather than 1.
(A8.8) Use lowercase roman numerals instead of numbers; begin with 1.
(A8.9) Start the roman numerals at 5 instead of 1.
(A8.10) Change your test_list.htm file to look like this:
<DT> ASCII files</DT>
<DD> Files that are comprised of alphanumeric characters.
Some FTP programs refer to ASCII files as "text" files.</DD>
<DD> File Transfer Protocol; a protocol for moving files over the
Internet from one computer to another. FTP is a client/server
system: one machine must be running an FTP server, the other an
Then, do the following:
(A8.11) View it using both INTERNET EXPLORER and NETSCAPE NAVIGATOR.
(A8.12) Make it more compact, by using: <DL COMPACT> View it again using both INTERNET EXPLORER and NETSCAPE NAVIGATOR. What happens? (Look carefully!)
(A8.13) Create an appropriate list on your homepage. Insert a comment to yourself
before the list that reminds you how the list construction works. (For example, you might need to remind yourself what "UL" and "DT" stand for.)
Your homepage will end up being a wonderful example of all the HTML stuff
that you're learning; load it with comments so that it will be more useful to
you months from now!