In this lesson, you will learn how to create lists
and indent text in your HTML document.
You will need three windows open on your screen
at this time. A Netscape window displaying this
tutorial, an experimental window to view your HTML
document, and a window in which you will type
the HTML document.
HTML supports unnumbered, numbered, and definition lists.
You can also nest lists.
Unnumbered Lists
To make an unnumbered, bulleted list,
Start the list with the <ul> Tag.
Enter the <li> Tag (list item) before each
item you want to list.
End the list with the closing </ul> Tag.
For example, the following source:
looks as follows, viewed through Netscape:
If you want an unnumbered list without the bullets,
delete the <li> Tag at
the beginning of each list item and put a <br>
Tag at the end of each list item.
Click on the window containing your HTML
document.
Using the source above, create an unnumbered
list without bullets. Save your changes, and
open your document in your experimental window.
Numbered Lists
To create a numbered list also called an ordered list,
it is identical to creating an unnumbered list except it uses
the <ol> and </ol> Tags.
For example, the following source:
looks as follows, viewed through Netscape:
It is your turn now.
Click on the window containing your HTML
document.
Create an unnumbered list of three of your
favorite musicians and create a numbered list
of three of your favorite sports. Save your
changes.
When you are done open your document in the
experimental window.
Nested Lists
You can nest any type of list inside another list.
The following source will display a numbered list
inside an unnumbered list.
For example, the following source:
looks as follows, viewed through Netscape:
Definition Lists
A definition list requires three tags:
<dl> Definition List Tag
<dt> Definition Term Tag
<dd> Definition Definition Tag
For example, the following source:
looks as follows, viewed through Netscape:
Indenting Text
You can use the <dl> Definition List Tag
and then use the <dd> Definition Definition Tag
for each indented line. You do not need to use the Definition
Term Tag.
Another way to display text exactly how you type it in is by
using the <pre> and </pre> Preformatted Text
Tags. The Web browser will display the text exactly how
it is typed in when it is contained in these tags.
Click on the window containing your HTML
document.
