CSS: The Missing Manual

List Properties

The following properties affect the formatting of bulleted lists (<ul>) and numbered lists (<ol>).

list-style (inherited)

This property is a shorthand method of specifying the three properties listed next. You can include a value for one or more of those properties, separating each by a space. You can even use this property as a shortcut for writing a single property and save a couple of keystrokes: list-style: outside, instead of list-style-position: outside. If you specify both a type and an image, a Web browser will display the bullet type (disc, square, and so on) only if it can't find the image. This way, if the path to your custom bullet image doesn't work, you don't end up with a bulletless bulleted list.

• Values: Any valid value for list-style-type, list-style-image, and/or list-style-position.

• Example: list-style: disc url(images/bullet.gif) inside;

list-style-image (inherited)

Specifies an image to use for a bullet in a bulleted list.

• Values: an URL value (Section A.1.1) or none.

• Example: list-style-image: url(images/bullet.gif);

Tip

The background-image property does the custom bullet job just as well and offers more control (see Section 8.2).

list-style-position (inherited)

Positions the bullets or numbers in a list. These markers can appear outside of the text, hanging off to the left, or inside the text (exactly where the first letter of the first line normally begins). The outside position is how Web browsers normally display bullets and numbers.

• Values ...