symbols()
Limited availability
This feature is not Baseline because it does not work in some of the most widely-used browsers.
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.