Trusted answers to developer questions
Trusted Answers to Developer Questions

Related Tags

css
html
communitycreator

What is the CSS counter-reset property?

Behzad Ahmad

Grokking Modern System Design Interview for Engineers & Managers

Ace your System Design Interview and take your career to the next level. Learn to handle the design of applications like Netflix, Quora, Facebook, Uber, and many more in a 45-min interview. Learn the RESHADED framework for architecting web-scale applications by determining requirements, constraints, and assumptions before diving into a step-by-step design process.

The counter-reset property in CSSCascade Style Sheets sets or resets the counter values in CSS.


This property is used with the content and the counter-increment property.


Syntax


counter-reset: none|name number|initial|inherit;

Property values

  • none: It is the default value. We can not reset the value of the counter using this.

  • id: It specifies the counter that has to be reset. The default reset value is 0.

  • initial: This sets the value to its default value.

  • inherit: This inherits the property from its parent value.

Code

The following is the basic HTMLHyperText Markup Language and CSS code to demonstrate the use of the counter-reset property.

Explanation

In this example, we make the counter on Employee. We reset the counter using the counter-reset property. This deletes any previous value in the count, and the count is set to 0.

RELATED TAGS

css
html
communitycreator

Grokking Modern System Design Interview for Engineers & Managers

Ace your System Design Interview and take your career to the next level. Learn to handle the design of applications like Netflix, Quora, Facebook, Uber, and many more in a 45-min interview. Learn the RESHADED framework for architecting web-scale applications by determining requirements, constraints, and assumptions before diving into a step-by-step design process.

Keep Exploring