Core Code
Core Code Modern Dev Handbook

Custom Counter Style

Counters can use different numbering styles.

Preview

Code

<style>
body{
counter-reset:item;
}

p::before{
counter-increment:item;
content:counter(item, upper-roman) ". ";
}
</style>

<p>First item</p>
<p>Second item</p>
<p>Third item</p>

More CSS Counters Examples (8)

example Basic CSS Counter open example example CSS Counter List open example example Nested CSS Counters open example example Counter Step Increment open example example Section Numbering open example example Counter Reset Example open example example Leading Zero Counter open example example Alphabet Counter open example