HTML and CSS Reference
In-Depth Information
<ul>
<li>Item 1 - type disc</li>
<li>Item 2 - type disc</li>
</ul>
disc
bullet list
<ul style=”list-style-type: square”>
<li>Item 1 - type square</li>
<li>Item 2 - type square</li>
</ul>
square
bullet list
circle
bullet list
<ul style=”list-style-type: circle”>
<li>Item 1 - type circle</li>
<li>Item 2 - type circle</li>
</ul>
Figure 2-12
order must be emphasized, such as a series of steps. Figure 2-13 shows Web page text
formatted as ordered, or numbered, lists and the HTML tags used to create the lists.
The
<ul>
and
</ul>
tags must be at the start and end of an unordered or bulleted
list. The
<ol>
and
</ol>
tags are used at the start and end of an ordered or numbered
list. Unordered and ordered lists have optional bullet and number types. As shown in
Figure 2-12, an unordered list can use one of three different bullet options: disc, square,
or circle. If no type is identified, the default, disc, is used. You can also use an image as a
bullet as is shown in a later chapter. An ordered list can use numbers, letters, or Roman
numerals, as shown in Figure 2-13. The default option is to use Arabic numbers, such as
1, 2, and 3. After the <ul> or <ol> tag is entered to define the type of list, the
<li>
and
</li>
tags are used to define each list item within an ordered or unordered list.
<ol>
<li>Item 1 - default type</li>
<li>Item 2 - default type</li>
</ol>
<ol style=”list-style-type: lower-alpha”>
<li>Item 1 - type lower-alpha</li>
<li>Item 2 - type lower-alpha</li>
</ol>
default type
lower-alpha
<ol style=”list-style-type: lower-roman”>
<li>Item 1 - type lower-roman</li>
<li>Item 2 - type lower-roman</li>
</ol>
lower-roman
upper-alpha
<ol style=”list-style-type: upper-alpha”>
<li>Item 1 - type upper-alpha</li>
<li>Item 2 - type upper-alpha</li>
</ol>
upper-roman
<ol style=”list-style-type: upper-roman”>
<li>Item 1 - type upper-roman</li>
<li>Item 2 - type upper-roman</li>
</ol>
Figure 2-13
