YouTip

## Definition and Usage The counter-reset property creates or resets one or more counters. The counter-reset property is usually used together with the content and counter-increment properties to create automatic numbering in CSS. ## Browser Support | Property | Chrome | Firefox | Safari | Edge | Opera | | :--- | :--- | :--- | :--- | :--- | :--- | | counter-reset | 1.0 | 1.0 | 1.2 | 4.0 | 8.0 | ## CSS Syntax ```css counter-reset: none|_ID number_|initial|inherit; ``` ## Property Values | Value | Description | | :--- | :--- | | none | Default value. Creates or resets no counters | | _ID number_ | Specifies the ID name of the counter and its initial value (the default value is 0) | | initial | Sets this property to its default value. | | inherit | Inherits this property from its parent element. | ## More Examples ### Example Create an automatic numbered list: ```css ol { counter-reset: section; /* Set counter to 0 */ } li::before { counter-increment: section; /* Increment counter */ content: "Section " counter(section) ": "; /* Display counter */ } ``` ## Related Pages [CSS Tutorial: CSS Counters]( [CSS Reference Manual: The counter-increment Property](