HTML and CSS Reference
In-Depth Information
Figure 1-25
Viewing an unordered list
code for an unordered list
by default, browsers display
unordered lists as bulleted lists
Trouble?
In some browsers, the list appears with diamond shapes rather than
circular bullets.
By default, most browsers display unordered lists using a bullet symbol. The exact bul-
let symbol depends on the browser, but most browsers use a fi lled-in circle.
Nesting Lists
You can place one list inside of another to create several levels of list items. The top level
of a nested list contains the major items, with each sublevel containing items of lesser
importance. Most browsers differentiate the various levels by increasing the indentation
and using a different list symbol at each level. You'll use the demo page to see how this
works with unordered lists.
To create a nested list:
◗
1.
Click after the word
Stick
in the
<li>Basic Stick</li>
line, and then press the
Enter
key to insert a new blank line.
◗
2.
Indent the following code between the code
<li>Basic Stick
and the closing
</li>
tag:
<ul>
<li>Red</li>
<li>Blue</li>
<li>Green</li>
</ul>
◗
3.
Click the
Preview Code
button. Figure 1-26 shows the resulting nested list in the
browser.
