Little Web Hut

CSS 2.1 Reference: list-style-image Property

CSS list-style-image Property
Syntax
selector {list-style-image: value;}
  • value is specified by using a URI or one of the following keywords: none or inherit.
Usage

The list-style-image property is used to specify an image to use for the list item marker. Alternately, if the keyword none is specified, then the list item marker's appearance will be determined by the value of the list-style-type property.

This property is specified by using a URI, or a keyword, according to the syntax shown above. In the event that the image cannot be displayed, the list item marker's appearance will be determined by the value of the list-style-type property.


CSS Example: The list-style-image property is set by specifying the URL of an image.
  li {list-style-image: url("../images/list_marker.gif");}
Test It HTML StyleTest It XHTML StyleTest It HTML5 Style

Keywords
  • none - No image is specified. The list item marker's appearance will be determined by the value of the list-style-type property
  • inherit - The inherit keyword is used to specify that the value for this property should be taken from the parent element. If inherit is used with the root element, then the initial value for this property will be used.
Applies To Elements that have a display property value of list-item. This is typically the default value for the HTML <li> element.
Inherited Yes
Initial Value none


list-style-image Property Examples
Test It HTML StyleTest It HTML StyleTest It HTML5 StyleThe list-style-image property is set by specifying the URL of an image.