HTML and CSS Reference
In-Depth Information
•
circle
•
disc
•
square
There's little point in a screen shot at this juncture—those values will apply the bullet
styles shown in Figure 12-6 earlier (in the order disc, circle, and square for the first three nest-
ing levels, respectively), but at least you now have control over the default style (you could
specify that all levels of list items be set to use the square symbol, for example).
Styled Ordered Lists
A useful feature of lists in CSS is the ability to create sequential lists that go beyond the browser
default of numbering 1, 2, 3, and so on. Figure 12-7 shows an unstyled ordered list on the left
and, on the right, some other ordering options.
Figure 12-7.
Ordered list styles
The CSS to achieve the numbering shown in the list on the right in Figure 12-7 is
ol li ol li {
list-style-type:upper-alpha;
}
ol li ol li ol li {
list-style-type:lower-alpha;
}
ol li ol li ol li ol li {
list-style-type:upper-roman;
}
ol li ol li ol li ol li ol li {
list-style-type:lower-roman;
}
Of course, you don't have to apply these different styles to these levels—you could apply
any one of those styles, for example
lower-alpha
, to
all
of the list items (even
unordered
list
items will accept this sequential presentation, although that's not the proper underlying
markup for the job).
