list-style-type
Définit le style de puce à utiliser [CSS1]
list-style-type: disc | circle | square | decimal | decimal-leading-zero |
lower-roman | upper-roman | lower-greek | lower-latin | upper-latin |
armenian | georgian | lower-alpha | upper-alpha | none
@counter-style permet de définir de nouveaux styles de puce.
symbols() permet d’en créer à la volée.
list-style-position
Définit si les puces sont affichés à l’intérieur ou à l’extérieur des bordures du li [CSS1]
list-style-position: inside | outside
list-style-image
Définit l’image à utiliser comme puce [CSS2]
list-style-image: <image> | none
list-style
Raccourcis permettant de définir le style d’une liste [CSS1,2]
list-style: <list-style-type> <list-style-position> <list-style-image>
Exemple:
{
list-style-type: none;
}
Les compteurs sont des variables que l’on incrémente en CSS à chaque fois qu’elles sont utilisées.
Cela permet d’ajouter une numérotation dans la page en dehors des <li>.
counter-increment
Incrémente la valeur du compteur nomducompteur à chaque fois qu’il s’applique à un élément [CSS3]
counter-increment: <string>
counter-reset
Réinitialise le compteur à 0 [CSS3]
counter-reset: <string>
Les fonctions counter() et counters() permettent de récupérer la valeur du counter.
Exemple:
{
counter-increment: moncounter;
*:first-child {
counter-reset: moncounter;
}
&::before {
content: counters(nom, ".");
}
}