Дескриптор `negative` at-правила CSS

Дескриптор negative at-правила @counter-style позволяет задать, как отображаются отрицательные значения счётчика при создании пользовательских стилей счётчиков. Значение дескриптора negative задаёт символы, которые добавляются перед представлением счётчика и после него, если значение счётчика отрицательное.

Синтаксис

/* One <symbol> value */
negative: "--"; /* Adds '--' before if counter value is negative */

/* Two <symbol> values */
negative: "(" ")"; /* Adds '(- before and ')' after if counter value is negative */

Значения

Дескриптор negative принимает до двух значений <symbol>.

<symbol>

Если указано только одно значение, оно добавляется перед представлением счётчика, когда счётчик имеет отрицательное значение. Если указаны два значения, первое добавляется перед представлением счётчика, а второе — после него, когда счётчик имеет отрицательное значение.

Описание

Если значение счётчика отрицательное, указанное значение <symbol> для дескриптора negative добавляется перед представлением счётчика, заменяя значение - по умолчанию для отрицательных значений. Второе значение <symbol>, если оно указано, добавляется после представления счётчика.

Дескриптор negative имеет значение в двух случаях: если у стилей счётчиков значение system равно symbolic, alphabetic, numeric или additive и счётчик имеет отрицательное значение; а также если значение system равно extends и сам расширенный стиль счётчика использует знак минус. Для систем, не поддерживающих отрицательные значения счётчиков, указание дескриптора negative не влияет на результат и игнорируется.

Формальное определение

Формальный синтаксис

Примеры

Отображение отрицательных значений счётчика

В этом примере стиль списка расширяется с использованием стиля decimal. Дескриптор negative используется для добавления (- и ) перед отрицательными значениями счётчика и после них.

HTML

<ol start="-3">
  <li>Negative three</li>
  <li>Negative two</li>
  <li>Negative one</li>
  <li>Zero</li>
  <li>One</li>
</ol>

CSS

@counter-style neg {
  system: extends decimal;
  negative: "(-" ")";
  suffix: ": ";
}

ol {
  list-style: neg;
}

Результат

Префикс и суффикс, указанные в качестве значения дескриптора negative, добавляются к маркеру только тогда, когда значение счётчика меньше нуля.

Спецификации

Совместимость с браузерами

См. также

• Дескрипторы @counter-style: system, symbols, additive-symbols, prefix, suffix, range, pad, speak-as, fallback
• Свойства стиля списка: list-style, list-style-image, list-style-position
• Функция symbols() для создания анонимных стилей счётчиков
• Модуль стилей счётчиков CSS
• Модуль списков и счётчиков CSS