list-style-image (CSS property)

Spec
Inherited Initial Version
Yes none CSS1
Browser support (more…)
IE5.5+ FF1+ SA1.3+ OP9.2+ CH2+
Buggy Full Full Full Full

Syntax

list-style-image: { uri | none | inherit } ;

Description

This property specifies the image to use as a list marker for an item in a list (an element whose display property has the value list-item). If the specified image is available, it will replace any marker specified by the list-style-type property.

The exact position of the list marker image can’t be specified beyond what the list-style-position property allows.1

Example

This style rule assigns an image as the list marker for all items in the list with ID "links":

#links li {
  list-style-image:
  ➥    url("/images/link.png");
}

Value

If the property value is specified as none, no list marker image will be used. Instead, the list-style-type property will control what type of list marker—if any—will be rendered.

If the value is specified as a URI using the url() functional notation, the image at that URI will be used as the list marker if it’s available.

Compatibility

Internet Explorer Firefox Safari Opera Chrome
5.5 6.0 7.0 8.0 1.0 1.5 2.0 3.0 3.5 1.3 2.0 3.1 4.0 9.2 9.5 10.0 2.0
Buggy Buggy Buggy Buggy Full Full Full Full Full Full Full Full Full Full Full Full Full

In Internet Explorer for Windows versions up to and including 7, a floated list item will not display any list marker image.

Internet Explorer for Windows versions up to and including 7 have a shorthand bug where it won’t hide the list-image using list-style:none but requires list-style-image:none instead (note that the image must exist for this bug to be tested).

Internet Explorer for Windows versions up to and including 7 don’t support the value inherit.

Internet Explorer for Windows version 8 will crash the current tab when list-style-image (with a valid path value) is applied via the universal selector.

Footnotes

1 It has become common practice, however, to apply a background image to the list items in order to gain precise control over list item marker image positioning.

User-contributed notes

Related Products