Кратко
СкопированоС помощью свойства counter создаются новые счётчики на элементе.
Пример
СкопированоСоздаём счётчик с именем example и начальным значением 1 на элементе <li>:
li { counter-reset: example 1;}
li {
counter-reset: example 1;
}
Как понять
СкопированоПеред тем как использовать значение счётчика в функциях counter и counters, этот счётчик нужно создать. Именно для этого существует свойство counter.
Каждый элемент имеет коллекцию из нуля или более счётчиков, которые наследуются через дерево документа подобно наследуемым значениям свойств.
Как пишется
СкопированоЧтобы создать новый счётчик на элементе, в значении свойства нужно указать имя счётчика и число, с которого начнётся отсчёт.
По умолчанию начальное значение равно 0, если не указано иное.
Здесь создаётся новый счётчик с именем chapter и начальным значением 0:
li { counter-reset: chapter;}
li {
counter-reset: chapter;
}
Чтобы не создавать новый счётчик, можно указать ключевое слово none — это значение по умолчанию.
li { counter-reset: none;}
li {
counter-reset: none;
}
Аргументы
СкопированоИмена счётчиков чувствительны к регистру. Например, значения example и EXAMPLE — это два разных, не связанных между собой счётчика.
Нельзя использовать ключевые слова: none, initial, inherit, unset, default в качестве названий счётчиков.
В значении свойства можно указать 1 или более счётчиков. Указываются они по порядку через пробел.
li { counter-reset: count1 -1 count2 99;}
li {
counter-reset: count1 -1 count2 99;
}