Форкнул первый попавшийся
пример с коудпена и подогнал под твои условия. Итак, смотри:
1) В элементе-родителе (в моём примере это список с классом custom-counter) я создаю счётчик при помощи свойства
counter-reset с переменной
li
2) В псевдоэлементе ::before, принадлежащему каждому li я ставлю автоматический инкремент на каждый новый li при помощи свойства
counter-increment: li
3) Прописываю желаемый контент счетчика, в моём случае это
content: "Пункт " counter(li) ": "
4) Теперь я могу назначить каждому псевдоэлементу желаемые свойства: задний фон, цвет текста и так далее