ul类线条式无法以任何形式工作

Question

我有一个无序列表，附有一个css类标记，每个附加到此类的属性都可以使用CSS，除了＆＃34; list-style＆＃34;属性。 （基本上我试图用我自己的图像获得子弹点，通常是一个非常简单的任务，但目前它确实不是。

HTML 代码：

<ul class="bullets">
    <li>The prices abo...</li>
    <br>
    <br>
    <li>The above t...</li>
    <br>
    <br>
    <li>If you wish ...</li>
    <br>
    <br>
    <li>Price is also depe...</li>
    <br>
    <br>
    <li>A white underb...</li>
    <br>
    <br>
    <li>If you w...</li>
</ul>

CSS 代码：

ul.bullets li {
    font-size:12px;
    font-family:"Tw Cen MT";
    color:#000000;
    list-style:url('../images/bulleta.png');
}

正如我所说，CSS类中的每个属性都可以正常工作，除了list-style:url('bulleta.png');属性，图像被加载到服务器上，所以不确定为什么它不能工作，我已经尝试将类附加到ul以及ul列表中。

任何人都知道我哪里错了？谢谢你的帮助

Answer 1

应该可以正常工作。请参阅 this fiddle。 确保已缩进ul足以查看图像（取消注释行以查看效果）。

CSS：

ul
{
    //margin-left:100px;    
}
ul.bullets li
{
   font-size:12px;
   font-family:"Tw Cen MT";
   color:#000000;
   list-style:url('src');
}

HTML：

<ul class="bullets">
    <li>The prices abo...</li>
    <br><br>
    <li>The above t...</li>
    <br><br>
    <li>If you wish ...</li>
    <br><br>
    <li>Price is also depe...</li>
    <br><br>
    <li>A white underb...</li>
    <br><br>
    <li>If you w...</li>
</ul>

您可能还想在浏览器中查看网络标签（首先显示开发工具，通常是 CTRL SHIFT i ）确保实际检索图像。

<强>更新

根据您发送的链接，我可以看到发生了什么，media='all'覆盖了列表项的显示。

请注意，media=all显示覆盖了列表项。当我取消选择此样式时，会显示您的图像。

作为一个简单的解决方案，您只需将display:list-item;添加到ul.bullets li即可。 CSS将使用最多指定的。

Answer 2

我在代码中没有发现任何问题，即列表样式的图像源已损坏。你必须再次检查。 This is a jsbin demo除了图片的网址外，您的代码非常典型：