Définition de la css list-style-image

Propriété css : list-style-image

Détails des versions feuilles de style css list-style-image
css1
css2
Détails de compatiblilité de la feuilles de style css list-style-image pour les navigateurs
Netscape 4.78
Netscape 6+
Internet Explorer 4+
Mozilla + et Firefox +
Safari 1 +

Définition de list-style-image

La propriété de feuille de style css list-style-image permet de mettre une image à la place de l'item ou puce.
Exemple de code :
identifiant{
  list-style-image: URL(../images/puce.gif);
}

La propriété de feuille de style list-style-image css peut prendre la valeur de :
- URL {image.gif}
- none, aucune image.
- inherit, hérite de la propriété de son parent (css 2)

Descendre
Remonter

Exemple de code list-style-image

Application de list-style-image

La propriété de feuille de style css list-style-image est applicable sur les balises HTML ou XHTML ayant pour valeur display:list-item.
La propriété de feuille de style css list-style-image peut s'appliquer sur la balise HTML ou XHTML LI, UL, OL, DL, DD, DT.
La propriété de feuille de style list-style-image css n'a pas d'équivalent en HTML ou XHTML.

Descendre
Remonter

Héritage de list-style-image

Les balises filles HTML ou XHTML héritent de la propriété list-style-image.

Descendre
Remonter

Problèmes de list-style-image

La propriété de feuille de style css list-style-image pose un problème au niveau du positionnement de l'image qui varie suivant le navigateur.
Attention lorsque vous utilisez des feuilles de styles externes, netscape 4.7 prend comme point de départ de l'url l'endroit où se trouve la feuille de style alors que Internet Explorer prend comme origine la page html.
Donc si votre feuille de style est dans un autre dossier
mettez une url absolue (http://www.mon.site/image/fond.gif).

Descendre
Remonter

FAQ

Répond aux questions suivantes :

Comment mettre ou remplacer la puce par une image?
Liste des questions les plus fréquemment posées en css.
Descendre
Remonter

BUG INTERNAUTE

Explication

Vous trouverez ci-dessous divers bugs d'interprétation de la css list-style-image.
Ces bugs ont été transmis par les internautes du site.

J'ai vérifié certains bugs mais pour la plupart, ils sont soit sur MAC soit sur un navigateur que je ne possède pas.
Ceux que j'ai pu visualiser sont notés
Bug vérifié : oui.

Reporter un bug

Voir les Bugs[0]

Descendre
Remonter

Reporter un bug ou problème d'interprétationavec la propriété list-style-image
La balise HTML et XHTML LI correspond à une ligne d'une liste non ordonnée ou ordonnée.<LI> Exemple : Non ordonnée :<UL> <LI>Liste 1 <LI>Liste 2 </U...[Voir]La balise HTML et XHTML UL contient tous les éléments de la liste puce non ordonnée.<UL> </UL> Chaque élément de la liste est précédé par la balise HT...[Voir]La balise HTML et XHTML OL contient tous les éléments de la liste ordonnée.<OL> </OL>Chaque élément de la liste est précédé par la balise HTML et XHTM...[Voir]La balise HTML et XHTML DL contient tous les éléments de la liste de définition.<DL> </DL> Le mot que l'on veut définir est précédé de <DT>. La défini...[Voir]La balise HTML et XHTML DD permet de définir un résumé d'une définition dans une liste de définitions. <DD>La balise HTML et XHTML DL contient tous le...[Voir]La balise HTML et XHTML DT permet de définir un titre d'une définition dans une liste de définitions.<DT>La balise HTML et XHTML DL contient tous les ...[Voir]