Scholar Repository
Home>Manual>CSS Counter-reset Property

CSS Counter-reset Property

From http://www.w3schools.com (Copyright Refsnes Data)

CSS counter-reset Property


CSS Reference Complete CSS Reference


Definition

The counter-reset property sets the value the counter is set to on each occurrence of a selector. Default is 0.

Note: If "display: none" is used you should not be able to reset the counter. If "visibility: hidden" is used you should be able to reset the counter.

Inherited: No


JavaScript Syntax

CSS properties can also be dynamically changed with a JavaScript.

Scripting Syntax: object.style.counterReset="sub-section 2"

In our HTML DOM tutorial you can find a full Style Object Reference.


Example

A way to number sections and sub-sections with "Section 1", "1.1", "1.2", etc.

h1:before
{
content: "Section " counter(section) ". ";
/* Add 1 to section */
counter-increment: section;
/* Set sub-section to 0 */
counter-reset: sub-section;
}

h2:before 
{
content: counter(section) "." counter(sub-section) " ";
counter-increment: sub-section;
}

Possible Values

Value Description
none Default. No reset of the counter in the selector
identifier number The identifier defines a selector, id, or class that should reset the counter. The number sets the value the counter is set to on each occurrence of the selector. number can be a positive number,zero, or a negative number



CSS Reference Complete CSS Reference

From http://www.w3schools.com (Copyright Refsnes Data)

Home>Manual>CSS Counter-reset Property