List-Style-Image

list-style-image Support Key: [*CSS1\|CSS2\|CSS2.1] [IE4B2\|N6\|O3.5*\|S1]	Other List-Style Properties
	marker-offset list-style	list-style-type list-style-position
= Index DOT Css by Brian Wilson =

Quick Statistics
Default Value:		none
Applicable Elements:		All elements with a default or assigned display property value of 'list-item'
Inherit From Parent:		Yes
Applicable Media:		Visual
HTML Equivalent:		NA
Official Docs:		CSS1: Sect 5.6.4 CSS2: Sect 12.6.2, CSS2.1: Sect 12.5.1

What is it?: This property indicates a graphic to be used for the list markers in the list structure. This should override the default appearance of list-markers in the current HTML list structure. If a 'list-style-image' is given a value of 'none' or the URL can not be loaded, the 'list-style-type' will be used in its place. The 'list-style-type' should always be specified in the event the URL pointed to in 'list-style-image' can not be loaded.

Allowed Values
inherit
[CSS2|CSS2.1] [N7|O4|S1]: Type: Explicit; Description:
Explicitly sets the value of this property to that of the parent.
none
[CSS1|CSS2|CSS2.1] [IE4B2|N6|O3.5|S1]: Type: Explicit; Description:
No list-marker will be displayed for the list item.
[url]
[CSS1|CSS2|CSS2.1] [IE4B2|N6|O3.5|S1]: Type: Explicit; Description:
This value indicates the URL source for the list-marker graphic. It can be either an absolute or relative URL. If the graphic can not be loaded, whatever 'list-style-type' property is set will be used.

Example: Ext/Doc: ul { list-style-image: url(http://www.foo.com/bullet.gif) }; In-Line: <ul><li STYLE="list-style-image: url(http://www.foo.com/bullet.gif)">test
text in the list item</li></ul>

Browser Peculiarities

Internet Explorer

4.0+:
- Does not apply to elements with assigned 'display' property of "list-item" and does not apply to DL/DT/DD.
- Default horizontal alignment for marker images is right (OL-like markers are left aligned and UL-like markers are center aligned.)
Opera

3.5:
- Does not apply to elements with assigned 'display' property of "list-item" and does not apply to DL/DT/DD.
- Default horizontal alignment for marker images is right when applied to OL lists, center when applied to UL lists.
Safari

1.0+:
- Using a list-style-image on a list-item interrupts the previous counting sequence and the next marker will continue counting at zero. For example, a 3 item OL list with a list-style-image on the second LI element will have markers like this: "1., [image], 0." instead of "1., [image], 3."