list-style-image Attribute | listStyleImage Property

Gets or sets a value that indicates which image to use as a list-item marker for the object.

Syntax

CSS	{ list-style-image : sLocation }
Scripting	[ sLocation = ] object.style.listStyleImage

Possible Values

sLocation

String that specifies or receives one of the following values. none Default. No image is specified. url(sURL) Location of the image, where sURL is an absolute or relative URL.

The property is read/write for all objects except the following, for which it is read-only: currentStyle. The property has a default value of none. The Cascading Style Sheets (CSS) attribute is inherited.

DHTML expressions can be used in place of the preceding value(s). As of Internet Explorer 8, expressions are supported in IE7 Standards mode and IE5 (Quirks) mode only. For more information, see About Dynamic Properties and Defining Document Compatibility.

Remarks

The listStyleImage property can be applied to any element when margin and display: list-item are applied. The display: list-item property is available as of Microsoft Internet Explorer 6 and later.

The listStyleImage property can be applied to any element when margin and display: list-item are applied.

When the image is available, it replaces the marker that is set with the listStyleType marker.

If the left margin of the list item is set to 0 using one of the margin properties, the list-item markers do not show. The margin should be set to a minimum of 30 points.

Examples

The following examples use the list-style-image attribute and the listStyleImage property to set the image for markers.

This example uses ul as a selector in an embedded (global) style sheet to set the marker to the dot.gif image.

Copy

<STYLE>
    UL { list-style-image:url(dot.gif) }
</STYLE>

Code example: http://samples.msdn.microsoft.com/workshop/samples/author/dhtml/refs/list-style-image.htm

This example uses inline scripting to change the style of the list-item marker to an image when an onmouseover event occurs.

Copy

<UL onmouseover="this.style.listStyleImage='url(dot.gif)'">

Code example: http://samples.msdn.microsoft.com/workshop/samples/author/dhtml/refs/listStyleImage.htm

Standards Information

This property is defined in Cascading Style Sheets (CSS), Level 1 (CSS1).

Applies To

CSSStyleDeclaration, currentStyle, LI, OL, runtimeStyle, style, UL, CSSCurrentStyleDeclaration Constructor, CSSRuleStyleDeclaration Constructor, CSSStyleDeclaration Constructor