list-style attribute | listStyle Property

Sets or retrieves up to three separate listStyle properties of the object.

Syntax

HTML { list-style: sStyle }

Scripting object.style.listStyle [ = sStyle ]

HTML	{ list-style: sStyle }
Scripting	object.style.listStyle [ = sStyle ]

Possible Values

sStyle String that specifies up to three of the following values, in any order:

type Any of the range of type values available to the listStyleType property.

position Any of the range of position values available to the listStylePosition property.

image Any of the range of image values available to the listStyleImage property.

The property is read/write with a default value set by the browser; the cascading style sheets (CSS) attribute is inherited.

Expressions can be used in place of the preceding value(s), as of Microsoft® Internet Explorer 5. For more information, see Dynamic Properties.

Remarks

The listStyle property is a composite property. When specifying both the type and image values, the image value takes precedence, unless the image value is set to none or the image pointed to by the URL cannot display.

When the left margin of a 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.

Example

The following examples use the list-style attribute and the listStyle property to set the list style.

This example uses UL and UL.compact as selectors in an embedded (global) style sheet to define the styles of two different unordered lists.

Note For the UL.compact to override the image that is set with the UL selector, you must explicitly set the list-style-image attribute to 'none'.

Sample Code
<STYLE>
    UL { list-style: outside url(dot.gif) }
    UL.compact { list-style-image:none; list-style: inside circle }
</STYLE> 
</HEAD>
<BODY> 
<UL>
    <LI>...
    <LI>...
</UL>
<UL CLASS=compact>
    <LI>...
    <LI>...
</UL>
This feature requires Internet Explorer 4.0 or later. Click the icon below to install the latest version. Then reload this page to view the sample.

This example uses inline scripting to change the style of the list. If the default image cannot be located, a hollow circle is used.
<UL onmouseover="this.style.listStyle='url(dot.gif) circle'">
This feature requires Internet Explorer 4.0 or later. Click the icon below to install the latest version. Then reload this page to view the sample.

Applies To

[ Object Name ]

Platform Version

Win16:

Win32:

Mac:

Unix:

WinCE:

Version data is listed when the mouse hovers over a link, or the link has focus.

LI, OL, runtimeStyle, style, UL