Articles of css counter

Больше счетчиков в CSS

У меня проблема с счетчиками CSS. Я установил два счетчика: один индекс headings и других images индексов. Однако только один работает правильно, другой (для изображений) показывает только номер 1 во всех описаниях изображений. Здесь вы можете увидеть пример body { counter-reset: figcounter; counter-reset: head2counter; } .fig:before { counter-increment: figcounter; content: “Fig. ” counter(figcounter)”: “; font-weight: […]

Как остановить tags , мешающие счетчикам нескольких уровней заголовков?

Это расширение Как остановить tags , мешающие счетчикам? Принятый ответ решает проблему для одного уровня заголовков (т. Е. H1 в вопросе), но не в том случае, если имеется несколько уровней заголовков (см. Ниже) body { counter-reset: h1 h2 h3 h4; } h1 { counter-reset: h2 h3 h4; } h2 { counter-reset: h3 h4; } h3 […]

Как разместить счетчик css под абзацем текста?

Прилагаемая скрипка помещает counter-increment рядом с каждым абзацем. Возможно ли, в пределах каждого абзаца текста , включить элемент counter-increment под каждым абзацем, выровненный по правой стороне? Я также создал скрипку Если бы обновленная скрипка могла быть предоставлена, это было бы очень полезно, поскольку я все еще новичок в кодировании. HTML: Lorem ipsum dolor sit amet, […]

Можете ли вы подсчитать конкретный class с помощью CSS?

Допустим, у меня есть простой список: one two three four blabla five six blabla seven Теперь я хочу только число элементов списка с помощью classа count, Итак, если я добавлю CSS: li { list-style-type: decimal; } а затем удалите тип списка для элементов списка без classа: li:not(.count) { list-style-type: none; } Я получаю это: FIDDLE […]

Использовать счетчик css в calc

У меня есть список ul> li * 5 (не всегда такая же сумма). Я установил счетчик, для которого я получаю: 1 2 3 4 5 li:nth-child(n):before { counter-increment: skill; content: counter(skill); color: white; } Вопрос: Можно ли использовать счетчик (навык) внутри calc () или я могу добавить единицы к нему px em rem% ms s […]

Как остановить tags , мешающие счетчикам?

В приведенном ниже коде мне нужно использовать тег div в верхней части HTML для стилизации. Без тега div tags hx имеют нумеруемый контур правильно, но с помощью div на месте все происходит совершенно неправильно. Мне нужно, чтобы это работало так, но с тегом div все еще на месте, и мне нужно, чтобы он работал для […]

Создание номеров строк только с помощью CSS

Я пытаюсь создать код pre box с номерами строк перед каждой строкой. Я предпочитаю делать это только с помощью CSS. Это то, что я сделал pre { background: #303030; color: #f1f1f1; padding: 10px 16px; border-radius: 2px; border-top: 4px solid #00aeef; -moz-box-shadow: inset 0 0 10px #000; box-shadow: inset 0 0 10px #000; } pre span […]