B.62. list-style-type

This property lets you set the type of marker displayed list items. This may include actual list item (li) elements, or other elements with their display property set to list-item. If an affected element also has a list-style-image value other than none, this property defines the fallback marker to display if the image cannot be loaded.

Inherited: Yes

See also: Section B.59list-style, Section B.60list-style-image

B.62.1. Value

There are a wide range of constants available for this property.

The following "glyph" markers display a single symbol for all list items, and are commonly used for unordered lists:

• circle

• disc

• square

The following "numbering" markers display a number in the chosen format for each list item:

• decimal

• decimal-leading-zero

• lower-roman

• upper-roman

• hebrew

• georgian

• armenian

• cjk-ideographic

• hiragana

• katakana

• hiragana-iroha

• katakana-iroha

The following "alphabetic" markers display a letter in the chosen format for each list item:

• lower-alpha or lower-latin

• upper-alpha or upper-latin

• lower-greek

The special constant none displays no marker at all.

Initial value: none^[8]

^[8] This initial value applies to generic elements. Web browsers generally use a default internal style sheet that specifies a list-style-type of disc for unordered lists and decimal for ordered lists. Most browsers also assign unique default types to nested lists.

B.62.2. Compatibility

CSS Version: 1 (with multilingual constants added in CSS2)

This property is supported by all CSS-compatible browsers; however, most support only the CSS1 constants: circle, disc, square, lower-alpha, upper-alpha, lower-roman, upper-roman, and none.

Netscape 4 for Macintosh does not correctly support the none value—it displays question marks as list markers.

B.62.3. Example

This set of style rules sets top-level unordered lists to use square bullets, nested unordered lists to use circle bullets, and doubly-nested unordered lists to use disc bullets:

ul {
  list-style-type: square;
  list-style-image: none;
}
ul ul {
  list-style-type: circle;
}
ul ul ul {
  list-style-type: disc;
}