English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
counter-The increment CSS property increases the value of one or more counters. This property is very useful for creating automatic numbering features.
The following table provides usage instructions and version history for this property, as well as the syntax for using this property in JavaScript scripts.
| Default value: | none |
|---|---|
| Applicable to: | All elements |
| Inheritance: | None |
| Animatable: | NoPlease see Animation properties. |
| Version: | CSS 2,3 |
| JavaScript syntax: | object.style.counterIncrement="section" |
The syntax of this property is as follows:
counter-increment: [ identifier integer ]1 or more pairs | none | initial | inherit
The following examples demonstrate how to use counter-increment property.
body {
counter-reset: section;
}
h1 {
counter-reset: category;
}
h1:before {
counter-increment: section;
content: "Section " counter(section) ". ";
}
h2:before {
counter-increment: category;
content: counter(section) "." counter(category) " ";
}Test to see‹/›The following table describes the value of this property.
| Value | Description |
|---|---|
| identifier | The name of the counter to be incremented. |
| integer | The value to be added to the counter. The default increment is1. Allows zero or negative values. |
| none | No counter will be incremented. This is the default value. |
| initial | Set this property to its default value. |
| inherit | If specified, the associated element uses the value of its parent element's direction property. |
counter-Browser compatibility of the increment property, the numbers in the following table indicate the minimum version number of the browsers that support this property; all mainstream browsers support this property.
|
Warning: Internet Explorer 7and earlier versions do not support this counter-increment property. IE8Only in<!DOCTYPE>Supported only when a valid value is specified.
Please refer to the following tutorials:CSS pseudo-elements.
Related properties:content,counter-reset.