symbols()
Limited availability
Cette fonctionnalité n'est pas Compatible car elle ne fonctionne pas dans certains des navigateurs les plus utilisés.
La fonction symbols() permet de définir des styles pour les compteurs en ligne, directement comme valeur de la propriété CSS. À la différence des styles définis avec @counter-style, ces styles sont anonymes. La fonction symbols() ne possède pas toute la flexibilité offerte par la règle @ @counter-style mais peut s'avérer utile dans des cas où le style nécessaire n'est utilisé qu'une seule fois et où il n'est pas nécessaire d'utiliser toutes les options fournies par @counter-style.
Syntaxe
symbols() = symbols( <symbols-type>? [ <string> | <image> ]+ );
<symbols-type> est l'un des mots-clés suivants :
cyclic: le système utilisera les différentes valeurs les unes à la suite des autres, de façon cyclique.numeric: le système interprètera les valeurs fournies comme une suite numérique composant un système de numération.alphabetic: le système interprètera les valeurs fournies comme les chiffres d'un système de numération alphabétique (par exemple : A, B, C, AA, AB, AC, etc.) sans zéro.symbolic: le système parcourt les différentes valeurs fournies et en affiche une de plus à chaque cycle.fixed: le système affiche chaque symbole une fois puis poursuit avec les chiffres arabes.
Exemples
HTML
html
<ol>
<li>Un</li>
<li>Deux</li>
<li>Trois</li>
<li>Quatre</li>
<li>Cinq</li>
</ol>
CSS
css
ol {
list-style: symbols(alphabetic "*" "\2020" "\2021");
}
Résultat
Spécifications
| Specification |
|---|
| CSS Counter Styles Level 3 # symbols-function |
Voir aussi
@counter-stylelist-style-typeet la propriété raccourcie correspondante :list-style.