Wie zentriere ich das Bild im Listenstil vertikal?

Wenn Sie list-style-image verwenden, um ein kleines Symbol vor einem Listenelement zu setzen, wird es normal unter FF angezeigt. list-style-image zentriert das Bild vertikal
Wenn Sie list-style-image verwenden, um ein kleines Symbol vor einem Listenelement zu setzen, wird es normalerweise unter FF angezeigt,

aber Sie möchten es unter IE anzuzeigen Es zeigt auch eine normale Anzeige in der Mitte an und ist ungehorsam.
Das Nächstbeste ist, eine Kompromisslösung zu finden

Es besteht darin, das Hintergrundbild (Hintergrundbild) von ul li zu verwenden, um das Problem zu lösen.
Wie folgt:

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%)

Bitte probieren Sie es für den spezifischen Prozentsatz aus!

Das obige ist der detaillierte Inhalt vonWie zentriere ich das Bild im Listenstil vertikal?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!