Comment centrer verticalement l'image de style liste ?

Si vous utilisez list-style-image pour définir une petite icône devant un élément de liste, elle s'affichera normalement sous FF. list-style-image centre verticalement l'image
Si vous utilisez list-style-image pour définir une petite icône devant un élément de la liste, elle sera affichée normalement sous FF,

mais vous le souhaitez à afficher sous IE Il affiche également un affichage normal au centre, et est désobéissant.
La meilleure chose à faire est de trouver une solution de compromis.

Il s'agit d'utiliser l'image de fond d'ul li (image d'arrière-plan) pour résoudre le problème.
Comme suit :

ul li{ 
height:28px; /*列表项的高度*/ 
line-height
:28px; /*列表项的行高，行高与高设为相同，文字垂直居中*/ 
text-indent
:15px; /*文字缩进15个像素，不然压到图表了*/ 
background-image
:url("../images/icon.gif"); /*图片的url地址*/ 
background-position
:left 45%; /*北京图片的定位*/ 
background-repeat
:no-repeat; /*禁止图片平铺，显示一个就好了*/ 
}

Firefox : li{background-position:left 50%)
IE : li{background-position:left 45%)

Veuillez essayer pour connaître le pourcentage spécifique !

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!