Кратко
СкопированоС помощью свойства 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; }