HTML and CSS Reference
In-Depth Information
Figure 1-26
Viewing a nested list
code for a nested list
by default, browsers display nested
lists with different symbols
Trouble?
Depending on your browser, the nested list of basic stick colors might
appear with solid bullets rather than open circles.
The lower level of items is displayed using an open circle as the list bullet and addi-
tional indentation on the page. Once again, the exact format applied to these lists is
determined by each browser's internal style sheet.
Description Lists
A third type of list is the
description list
, which contains a list of terms, each followed by
its description. The structure of a description list is
<dl>
<dt>
term1
</dt>
<dd>
description1
</dd>
<dt>
term2
</dt>
<dd>
description2a
</dd>
<dd>
description2b
</dd>
...
</dl>
where
term1
,
term2
, etc. are the terms in the list and
description1
,
description2a
,
description2b
, etc. are the descriptions associated with the terms. Note that descrip-
tion lists must follow a specifi ed order, with each
dt
(defi nition term) element followed
by one or more
dd
(defi nition description) elements.
You'll study how to work with description lists by returning to the demo page.
To create a description list:
◗
1.
Replace the code in the left box of the HTML demo page with
<dl>
<dt>Basic Stick</dt>
<dd>Easiest stick to learn</dd>
<dt>Flower Stick</dt>
<dd>A graceful stick with tassels</dd>
<dt>Master Stick</dt>
<dd>Our most popular stick</dd>
</dl>
