CSS counter-increment Property


The counter-increment property sets how much the counter increments on each occurrence of a selector. Default increment is 1.
Note: If "display: none" is used you should not be able to increment the counter. If "visibility: hidden" is used you should be able to increment the counter. Inherited: No

JavaScript Syntax

CSS properties can also be dynamically changed with a JavaScript.
Scripting Syntax:"section 2"


A way to number sections with "Section 1", "Section 2", "Section 3"etc.: h1:before
content: "Section " counter(section) " ";
/* Add 1 to section */
counter-increment: section;
A way to number sections with "Section 1", "Section 3", "Section 5" etc.:
content: "Section " counter(section) " ";
/* Add 2 to section */
counter-increment: section 2;

Possible Values

Value Description
none Default. No increment of the counter in the selector
identifier number The identifier defines a selector, id, or class that should increment. The number defines how much to increment. number can be a positive number,zero, or a negative number

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