css – 如何给每个自己的子弹图像？

我努力了

<ul id="contact_list">
    <li id="phone">Local 604-555-5555</li>
    <li id="i18l_phone">Toll-Free 1-800-555-5555</li>
</ul>

同

#contact_list
{
    list-style: disc none inside;
}

#contact_list #phone
{
    list-style-image: url(images/small_wood_phone.png);
}

#contact_list #i18l_phone
{
    list-style-image: url(images/i18l_wood_phone.png);
}

无济于事只出现一个光盘。如果我想让每个单独的列表项目拥有自己的项目符号，那么如何用CSS实现这一点，而不使用背景图片。

编辑：我发现，尽管有什么消息告诉我，列表风格的图像规则正在以某种方式被覆盖。如果我内联规则，就像这样：

<li id="phone" style="list-style-image: url(images/small_wood_phone.png);">Local 604-555-5555</li>

那么一切都很好。由于我在测试用例中没有其他规则，因此我在运行中包含ul或li，我不知道为什么内联给出了不同的结果。

解决方法

首先确定您是否处于“怪异”模式，因为对于许多CSS属性，它有所不同。

其次，W3c specifies的URL应该是双引号(尽管我也不使用引号)。与规格一起去救你自己的麻烦下线。

如果您在DOCTYPE中指定“strict”，则浏览器可能会要求双引号。