list-style

Browser Internet Explorer Netscape Opera Safari Firefox
Version 5.5 6.0 7.0 8.0 8.0 9.0 7.0 8.0 9.2 9.5 1.3 2.0 3.1 1.5 2.0 3.0
Supported Yes Yes Yes Yes Yes Yes Yes Yes Yes Yes Yes Yes Yes Yes Yes Yes

Short information
CSS CSS2
Default value disc (for <UL>), decimal (for <OL>)
Inherited Yes
Applied To tags <DD>, <DT>, <LI>, <OL>and <UL> and also to all elements having specified the style property "display: list-item"
HTML analog <ul type > | <ol type > | <li type >
Reference to specification http://www.w3.org/TR/CSS21/generate.html#propdef-list-style

Description
This attribute allows specifying simultaneously a marker style, location and also the image which will be used as a marker. If you want to learn documents more carefully, you should look properties of each parameter separately: list-style-type, list-style-position and list-style-image.

Syntax

list-style: list-style-type || list-style-position || list-style-image

Arguments
There are any combinations of 3 values defining markers style. They can be in any order. Values are divided among themselves by a blank. Any argument is not obligatory; therefore not used values can be lowered.

Example

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
 <head>
  <meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
  <title>list-style</title>
  <style type="text/css">
   UL {
   list-style: square outside; /* Square markers */
                               /* Markers are placed autside 
                                  the text block */
   }
  </style>
 </head> 
 <body> 
 
  <ul>
   <li>Lorem ipsum dolor sit amet</li>
   <li>Consectetuer adipiscing elit</li>
   <li>Sed diem nonummy nibh euismod</li>
   <li>Tincidunt ut lacreet dolore magna aliguam erat volutpat. Ut wisis 
    enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit lobortis 
    nisl ut aliquip ex ea commodo consequat.</li>
  </ul>
 
 </body>
</html>

The result of this example is shown on the figure 1


Object model

[window.]document.getElementById("elementID").style.listStyle