CSS @counter-style 规则

定义和用法

CSS @counter-style 规则用于定义自定义计数器样式。

当预定义的样式不符合需求时,@counter-style 规则允许您定义自己的计数器样式。

实例

为列表指定自定义计数器样式:

@counter-style crown {
  system: cyclic;
  symbols: "\1F451";
  suffix: " ";
}
ul {
  list-style: crown;
}

亲自试一试

Sintassi CSS

@counter-style countername {
  uno o più descrittori
}

Valore dell'attributo

Valore Descrizione
countername

Definire il nome dello stile del contatore sensibile alle maiuscole e minuscole.

Attenzione: il nome del contatore non può essere: none, decimal, disc, square, circle, disclosure-open o disclosure-closed.

system

Definire l'algoritmo che converte il valore intero del contatore in una stringa.

Obbligatorio se il sistema è impostato su cyclic, numeric, alphabetic, symbolic o fixed,则需要 symbols 描述符。

Obbligatorio se il sistema è impostato su additive,则需要 additive-symbols 描述符。

symbols

Definire i simboli utilizzati per i tag (può essere una stringa, un'immagine o un identificatore personalizzato).

Obbligatorio se il descrittore system è impostato su cyclic, numeric, alphabetic, symbolic o fixed.

Simbolo UTF-8 HTML.

additive-symbols

Definire il tuple di somma del sistema aggiuntivo.

Il sistema di contatore a somma (come i numeri romani) è composto da una serie di simboli a peso.

L'elenco dei simboli del contatore e dei loro valori interi non negativi ordinati per peso, descrittori sono necessari.

Obbligatorio se il descrittore system è impostato su additive.

negative Definire il simbolo di prefisso o suffisso da aggiungere alla rappresentazione del tag quando il valore è negativo.
prefix Definire il simbolo di prefisso da aggiungere alla rappresentazione del tag.
suffix Definire il simbolo di suffisso da aggiungere alla rappresentazione del tag.
range

Definire la gamma di valori dello stile del contatore.

Se il valore del contatore è fuori della gamma, si torna al suo stile di riserva.

pad

Se il tag rappresenta che deve avere una lunghezza minima, utilizzare questo descrittore.

Ad esempio, se si desidera che il contatore inizi da 01 e vada avanti così, utilizzare il descrittore pad.

Per i contatori con un valore superiore al valore pad specificato, il tag viene costruito normalmente.

speak-as

Definire come il sintetizzatore vocale dovrebbe leggere lo stile del contatore.

Ad esempio, per elenchi ordinati, leggere come numeri o lettere; per elenchi non ordinati, leggere come avviso audio.

fallback

Definire il nome del contatore di fallback se il sistema non può costruire il tag o se è fuori della gamma specificata.

Se non è descritto un contatore di riserva o il sistema di riserva non può rappresentare il valore del contatore, si torna al formato decimale.

Supporto del browser

I numeri nella tabella indicano la versione del browser che supporta completamente questa @ regola.

Chrome Edge Firefox Safari Opera
91 91 33 17 77