css - 如何正确制作带有列表样式图像的跨浏览器兼容列表？

Question

我需要做这样的设计，

为了使这成为可能，我使用虚线作为 li 的背景，并使用 + 图标作为列表样式图像。但它在所有浏览器中看起来都不一样。

<ul>
   <li>item 1</li>
   <li>item 2</li>
   <li>item 3</li>
   <li>item 4</li>
   <li class="last">item 5</li>
</ul>

IE7 和 6 是这样的

Answer 1

这对我有用:

li{list-style-image: url(/images/list.png);_list-style-image: url(/images/list2.png);}

其中 list1 是原始的 12x12(px)，list2 20x15(px) 透明且位于左下角。现在我在所有 gekos 和 ie 中得到了相同的观点。 =)

您必须去测试第二张图片的大小，因为大小会因很多因素而异。