counter-reset

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 No No No Yes Yes Yes Yes Yes Yes Yes Yes Yes Yes Yes Yes Yes
Short information
CSS CSS2
Default value none
Inherited No
Applied To all elements
HTML analog No
Reference to specification http://www.w3.org/TR/CSS21/generate.html#propdef-counter-reset
Description

It defines the identifier in which the counter of certain element displays and also initial value of the counter will be stored. Such counter can be deduced with the help of property content and pseudo-elements after and before.

Syntax

counter-reset: none | [identifier] | [integral number]
Arguments
none
It denies the counter initiating for the current selector.
identifier
It specifies one or several variables in which value of the counter will be stored. Values are divided among themselves by a blank.
integral number
It is an initial value of each identifier. It is equal 0 by default.

Example

 
<!--
   LI { list-style-type: none; } /* Remove the primary list numeration */
   OL { counter-reset: list1; } /* Initiate the counter */
   OL LI:before {
    counter-increment: list1; /* Increase the counter value */
    content: counter(list1) ". "; /* Output the number */
   }
   OL OL { counter-reset: list2; } /* Initiate the counter of embed list  */
   OL OL LI:before {
    counter-increment: list2; /* Increase the counter value of embed list */
    content: counter(list1) "." counter(list2) ". "; /* Output the number */
   }
 
-->
<ol>
	<li>Point
<ol>
	<li>Subpoint</li>
	<li>Subpoint</li>
	<li>Subpoint</li>
</ol>
</li>
	<li>Point
<ol>
	<li>Subpoint</li>
	<li>Subpoint</li>
</ol>
</li>
</ol>
The result of this example is shown on the figure 1

Remark
For elements having the property "display : none" the counter value doesn't change