list-style

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

Platform Support

IENetscapeMozillaOperaSafari
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

inheritInherit the value from the parent element.
url(image-url.gif)list-style-image: List image placeholder.
nonelist-style-image: No list image.
insidelist-style-position: Place the bullet inside the left edge of the list.
outsidelist-style-position: Place the bullet outside the left edge of the list.
disclist-style-type: Filled-in circle bullet.
circlelist-style-type: Open circle bullet.
squarelist-style-type: Square bullet.
decimal-leading-zerolist-style-type: Numbered list starting with a zero (e.g. 01., 02., 03., etc.)
decimallist-style-type: Numbered decimal list (e.g. 1., 2., 3., etc.)
lower-romanlist-style-type: Lower-case Roman numeral list (e.g. i., ii., iii., etc.)
upper-romanlist-style-type: Upper-case Roman numeral list (e.g. I., II., III., etc.)
lower-greeklist-style-type: Lower-case Greek alphabet list
lower-alphalist-style-type: Lower-case alphabet list (e.g. a., b., c., etc.)
lower-latinlist-style-type: Lower-case alphabet list (e.g. a., b., c., etc.)
upper-alphalist-style-type: Upper-case alphabet list (e.g. A., B., C., etc.)
upper-latinlist-style-type: Upper-case alphabet list (e.g. A., B., C., etc.)
hebrewlist-style-type: Hebrew alphabet list.
armenianlist-style-type: Armenian alphabet list.
georgianlist-style-type: Georgian alphabet list.
cjk-ideographiclist-style-type: Cjk-ideographic list.
hiragana-irohalist-style-type: Hiragana-iroha list.
hiraganalist-style-type: Hiragana list.
katakana-irohalist-style-type: Katakana-iroha list.
katakanalist-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.quirksmode.org/css/lists.html

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

text_css aptana_docs