counters() - Fonction CSS
Résumé des caractéristiques de la fonction counters()
Description de la fonction counters()
.
La fonction counters()
renvoie une numérotation hiérarchique.
C'est à dire une numérotation à plusieurs niveaux, comme dans l'exemple ci-dessous.
- 1 - Instruments à vent.
- 1.1 - Trompette.
- 1.2 - Saxophone.
- 2 - Instruments à percussion.
- 2.1 - Tambour.
- 2.2 - Xylophone.
La fonction counters() peut être utilisée avec :
content
: Ajoute du contenu dans le document.
Syntaxe de la fonction counters()
.
n
est le nom d'un compteur.
'c'
est un caractère de séparation.
t
est un type de numérotation (on peut aussi utiliser la fonction symbols()
).
counters(
)
- content: counters(cpt1, '.', decimal); n c t
n
est le nom du compteur. Celui devra être initialisé avec la propriétécounter-reset
et incrémenté avec la propriétécounter-increment
.c
est le caractère qui sera utilisé pour séparer les différentes parties de la numérotation. C'est souvent le point, mais on peut envisager un tiret ou, plus rarement, plusieurs caractères.t
est le type de numérotation à utiliser :decimal
,lower-roman
,lower-alpha
, etc.
Reportez vous à la description de la fonctioncounter()
pour une description plus complète des types de numérotations prédéfinies.
Exemples.
Les listes ci-dessous sont à la fois un exemple d'utilisation des compteurs à plusieurs niveaux, et d'autre part une liste des propriétés ou fonctions CSS relatives aux compteurs.
Sur le deuxième exemple, les balises ul et li ont été rendues visibles, il faut veiller à bien respecter l'imbrication pour le bon fonctionnement des compteurs à plusieurs niveaux.
ul
liDirectives :
ul
li@counter-style/li
/ul
/li
liPropriétés :
ul
liPropriétés résumées :
ul
lilist-style/li
/ul
/li
liPropriétés individuelles :
ul
licontent/li
licounter-reset/li
licounter-set/li
licounter-increment/li
/ul
/li
/ul
/li
liFonctions :
ul
licounter()/li
licounters()/li
lisymbols()/li
/ul
/li
/ul
- Directives :
- Propriétés :
- Propriétés résumées :
list-style
- Propriétés individuelles :
- Propriétés résumées :
- Fonctions :
Compatibilité et prise en charge par les navigateurs.
Les navigateurs actuels traitent correctement les numérotations à plusieurs niveaux, ainsi que la fonction .
counters()
.
counters()
Navigateurs sur ordinateurs :
Navigateurs sur mobiles :
Navigateurs obsolètes ou marginaux :
Androïd Brower
Baidu Browser
Chrome
Chrome pour Androïd
Edge
Firefox
Firefox pour Androïd
Internet Explorer
KaiOS Browser
Opéra
Opéra Mobile
QQ Browser
Safari
Safari sur IOS
Samsung Internet
Oméra mini
Voir aussi, dans le même module de standardisation que counters()
.
Les spécifications CSS éditées par le W3C sont organisées en modules. counters()
fait partie du Module CSS - Listes et compteurs (CSS Lists and Counters Module). Les définitions suivantes sont également décrites dans ce même module.