CSS counter-increment Property
A way to number sections and sub-sections with "Section 1", "1.1", "1.2", etc.:
content:"Section " counter(section) ". ";
content:counter(section) "." counter(subsection) " ";
Try it yourself »
The counter-increment property is supported in all major browsers.
Note: IE8 supports the counter-increment property only if a !DOCTYPE is specified.
Definition and Usage
The counter-increment property increments one or more counter values.
The counter-increment property is usually used together with the counter-reset property and the content property.
|Animatable:||no. Read about animatable|
|none||Default value. No counters will be incremented|
|id number||The id defines which counter that should be incremented. The number sets how much the counter will increment on each occurrence of the selector. The default increment is 1. 0 or negative values, are allowed. If the id refers to a counter that has not been initialized by counter-reset, the default initial value is 0|
|initial||Sets this property to its default value. Read about initial|
|inherit||Inherits this property from its parent element. Read about inherit|
CSS reference: :before pseudo element
CSS reference: :after pseudo element
CSS reference: content property
CSS reference: counter-reset property
HTML DOM reference: counterIncrement property
Thank You For Helping Us!
Your message has been sent to W3Schools.