Join MDN and developers like you at Mozilla's View Source conference, 12-14 September in Berlin, Germany. Learn more at https://viewsourceconf.org

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 initialenone
Applicabilitééléments de liste
Héritéeoui
Médiavisuel
Valeur calculéenone ou l'image avec son URI rendue absolue
Animablenon
Ordre canoniquel'ordre unique et non-ambigu défini par la grammaire formelle

Syntax

/* 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.

Compatibilité des navigateurs

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

Étiquettes : 
 Contributeurs à cette page : SphinxKnight, fscholz, Sebastianz, teoli, FredB, Mgjbot, Fredchat, Kyodev, VincentN
 Dernière mise à jour par : SphinxKnight,