CSS counter() Function
Create a counter for the page (in the body selector). Increment the counter value for each <h2> element, and add the text "Section <value of the counter>:" before each <h2> element:
content: "Section " counter(section) ": ";
More "Try it Yourself" examples below.
Definition and Usage
The counter() function returns the current value of the named counter, as a string.
|countername||Required. The name of the counter (which is the same name used for the counter-reset and counter-increment properties)|
|counterstyle||Optional. The style of the counter (can be a list-style-type value)|
Set the style of the counter:
content: "Section " counter(section, upper-roman) ": ";
CSS reference: content property
CSS reference: counter-increment property
CSS reference: counter-reset property