Change Language


Follow Navioo On Twitter

list-style

Defines the properties for the list style for a list element.

Browser/User Agent Support

IE Netscape Mozilla Opera Safari
5.0+ 6.0+ 1.0+ 4.0+ 1.3.2+
  • IE: Browser support incomplete in IE 5, 6, and 7.
  • Safari: Safari does not support the "box" style.

Usage

[list-style-image] [list-style-position] [list-style-type]

Values

inherit Inherit the value from the parent element.
url(image-url.gif) list-style-image: List image placeholder.
none list-style-image: No list image.
inside list-style-position: Place the bullet inside the left edge of the list.
outside list-style-position: Place the bullet outside the left edge of the list.
disc list-style-type: Filled-in circle bullet.
circle list-style-type: Open circle bullet.
square list-style-type: Square bullet.
decimal-leading-zero list-style-type: Numbered list starting with a zero (e.g. 01., 02., 03., etc.)
decimal list-style-type: Numbered decimal list (e.g. 1., 2., 3., etc.)
lower-roman list-style-type: Lower-case Roman numeral list (e.g. i., ii., iii., etc.)
upper-roman list-style-type: Upper-case Roman numeral list (e.g. I., II., III., etc.)
lower-greek list-style-type: Lower-case Greek alphabet list
lower-alpha list-style-type: Lower-case alphabet list (e.g. a., b., c., etc.)
lower-latin list-style-type: Lower-case alphabet list (e.g. a., b., c., etc.)
upper-alpha list-style-type: Upper-case alphabet list (e.g. A., B., C., etc.)
upper-latin list-style-type: Upper-case alphabet list (e.g. A., B., C., etc.)
hebrew list-style-type: Hebrew alphabet list.
armenian list-style-type: Armenian alphabet list.
georgian list-style-type: Georgian alphabet list.
cjk-ideographic list-style-type: Cjk-ideographic list.
hiragana-iroha list-style-type: Hiragana-iroha list.
hiragana list-style-type: Hiragana list.
katakana-iroha list-style-type: Katakana-iroha list.
katakana list-style-type: Katakana list.

Example

To specify an unordered list with a square bullet outside of the list, use the following syntax: ul { list-style: square outside;}.

For a demonstration of the list-style-type attribute, see the demo page on quirksmode:

http://www.navioo.com/html_css/list_style_225.htm

Remarks

Use the list-style property as a shortcut to typing out all of the individual list-style properties separately. You can specify any valid value for a list-style property as part of list-style.

Availability

W3C CSS2

Related

Ajax Javascript feed

↑ Grab this Headline Animator