Customizing List Counters in CSS

Create custom counters for ordered lists or headings with counter-reset and counter-increment.

Source Code

ol {
    counter-reset: custom-counter;
}
ol li {
    counter-increment: custom-counter;
}
ol li::before {
    content: counter(custom-counter) ". ";
}