O'Reilly logo

Beginning CSS: Cascading Style Sheets for Web Design, Second Edition by Richard York

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Chapter 9. List Properties

In Chapter 8, you saw how the float and clear properties are used to control the flow of content in a web document. In this chapter, I look at properties used to control the styling of list elements. I cover the following:

  • The list-style-type property and how it's used to present different types of lists through a variety of marker styles for bulleted lists and numbered lists

  • The list-style-image property and how it's used to provide a custom marker for each list item

  • The list-style-position property and how it's used to control the positioning of list item markers

Like the CSS properties I covered in previous chapters, the CSS list properties give you complete control over the way you present and style list items.

The list-style-type Property

You use the list-style-type property to change the presentation of bulleted and numbered lists. For example, you can change an ordered list to a list using Roman numerals for markers, or you can change a bulleted list to one using squares instead of circles for markers. The following table outlines the list-style-type property and its possible values (as of CSS 2.1).

Property

Value

list-style-type

disc | circle | square | decimal | decimal-leading-zero | lower-roman | upper-roman | lower-greek | lower-latin | upper-latin | armenian | georgian | none

Initial value: disc

IE 6 and IE 7 support only CSS 1 keyword values: disc | circle | square | decimal | lower-roman | upper-roman | lower-alpha | upper-alpha | none.

Naturally, the ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required