垂直对齐 - 列出"list-style-image"

Question

谷歌搜索和SO浏览都没有帮助我 - 希望有人能解决这个问题:

我有以下html:

<ul>
<li>ABC 1</li>
<li>ABC 2</li>
<li>ABC 3</li>
<li>ABC 4</li>
</ul>

和css

ul {list-style-image:url(../img/hook.png);}
li {vertical-align:middle;color:#FFFFFF;font-size:16px;text-shadow: 0em 0.13em 0.13em #2A2A2A;font-family:Helvetica,Arial,Sans-Serif;font-weight:normal;}

"hook.png"图像是32x35像素 - 但每当我创建列表项时,文本(例如ABC ...)将始终显示在图像下方.尝试了线高和100%的东西 - 但都没有成功.

任何快速帮助:/？

Answer 1

尝试一些变化

ul{
    background-image: url(../img/hook.png);
    background-repeat: no-repeat;
    background-position: 95% 50%;
}

显然,这个位置不太适合你的需求,但摆弄这种方法将是你最好的选择.