CSS Counter-increment Property

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

# CSS counter-increment Property

Complete CSS Reference

## Definition

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: object.style.counterIncrement="section 2"

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

## Example

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.:

h1:before
{
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

Complete CSS Reference

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