Latest

recent

CSS counter-reset Property

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"

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

Goto CSS3 and CSS2 complete reference
CSS counter-reset Property Reviewed by 1000sourcecodes on 21:40 Rating: 5
Powered by Blogger.