list-style-image

La propriété list-style-image définit l'image utilisée comme puce devant les éléments de listes. On peut également utiliser la propriété raccourcie list-style.

Valeur initiale	`none`
Applicabilité	éléments de liste
Héritée	oui
Média	visuel
Valeur calculée	`none` ou l'image avec son URI rendue absolue
Type d'animation	discrète
Ordre canonique	l'ordre unique et non-ambigu défini par la grammaire formelle

Syntaxe

/* Valeurs avec un mot-clé*/
list-style-image: none;

/*  Valeurs pointant vers une image */
list-style-image: url('starsolid.gif');

/* Valeurs globales */
list-style-image: inherit;
list-style-image: initial;
list-style-image: unset;

Valeurs

uri: Emplacement de l'image à utiliser comme puce.
none: Aucune image ne sera utilisée comme puce. Si cette valeur est définie, le marqueur défini avec list-style-type sera utilisé à la place.

Syntaxe formelle

<uri> | none

Exemple

CSS

ul {
  list-style-image: url("https://mdn.mozillademos.org/files/11981/starsolid.gif")
}

HTML

<ul>
    <li>Élément 1</li>
    <li>Élément 2</li>
</ul>

Résultat

Spécifications

Spécification	État	Commentaires
CSS Lists and Counters Module Level 3 La définition de 'list-style-image' dans cette spécification.	Version de travail	Propriété étendue pour supporter n'importe quel type `<image>`.
CSS Level 2 (Revision 1) La définition de 'list-style-image' dans cette spécification.	Recommendation	Définition initiale.

Fonctionnalité	Chrome	Firefox (Gecko)	Internet Explorer	Opera	Safari
Support simple	1.0	1.0 (1.7 ou moins)	4.0	7.0	1.0

Fonctionnalité	Android	Firefox Mobile (Gecko)	IE Phone	Opera Mobile	Safari Mobile
Support simple	1.0	1.0 (1)	6.0	6.0	1.0

Voir aussi

Étiquettes et contributeurs liés au document

Dernière mise à jour par : SphinxKnight, 20 sept. 2016 à 00:18:21