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.
/* 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;
| 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 |
Note : Cette propriété s'applique aux éléments d'une liste (c'est-à-dire aux éléments pour lesquels display: list-item;}}). Par défaut, cela inclut les éléments <li>. Cette propriété peut être héritée par les éléments et si on veut donc gérer une liste de façon uniforme, on pourra appliquer la propriété à l'élément parent (qui correspond en général à <ol> ou à <ul>).
Syntaxe
Valeurs
url- 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-typesera utilisé à la place.
Syntaxe formelle
<url> | 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) | Edge | Internet Explorer | Opera | Safari |
|---|---|---|---|---|---|---|
| Support simple | 1.0 | 1.0 (1.7 ou moins) | (Oui) | 4.0 | 7.0 | 1.0 |
| Fonctionnalité | Android | Firefox Mobile (Gecko) | Edge | IE Phone | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|---|
| Support simple | 1.0 | 1.0 (1) | (Oui) | 6.0 | 6.0 | 1.0 |
Voir aussi
Étiquettes et contributeurs liés au document
Étiquettes :
Contributeurs à cette page :
SphinxKnight,
Hinato15,
fscholz,
Sebastianz,
teoli,
FredB,
Mgjbot,
Fredchat,
Kyodev,
VincentN
Dernière mise à jour par :
SphinxKnight,