Styling Unordered Lists

As with ordered lists, you can change the marker, replace it with an image, and modify the list marker's position in relation to the text.

Unordered list markers can be styled using one of three keywords: disc, circle, or square (see Example 10-7).

Example 10-7. Inline styles demonstrating the three marker keywords for unordered lists

<h2>What to Bring:</h2><ul><li style="list-style-type: disc;">A beverage of choice.</li><li style="list-style-type: circle;">Munchies.</li><li style="list-style-type: square;">Music and movies.</li></ul>

Figure 10-12 shows the shapely results.

Figure 10-12. Showing off the disc, circle, and square options—note that some browsers will use slightly different markers, but the general ...

Get Spring Into HTML and CSS now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.