2

我将列表样式类型应用于作为图像的无序列表。正如您在下面看到的,我的无序列表中有一个额外的无序列表。

我希望嵌套无序列表具有“圆形”列表样式类型,这就是我对嵌套无序列表使用内联样式的原因。

我遇到的问题是它仍然在嵌套列表中显示列表样式的绿色复选标记,而不是圆形列表样式。

到目前为止,每次我使用内联 css 它都会覆盖任何外部样式规则,这就是为什么我不确定在这种情况下我应该做什么,我感谢任何建议。

css

ul{list-style-image:url(images/green-checkmark.png);}

标记

<ul>
    <li>hello</li>
    <li>animals
         <ul style="list-style-type:circle;">
           <li>cats</li>
           <li>dogs</li>
           <li>rats</li>
            <li>hogs</li>
            <li>snakes</li>
            <li>frogs</li>
        </ul>
    </li>
    <li>onions</li>
</ul>
4

2 回答 2

4

试试<ul style="list-style-type:circle; list-style-image: none;">

这两个属性是不同的。如果您设置list-style-image了它覆盖的任何内容list-style-type,则后者仅在图像不可用时使用(作为备份)。因此,要强制不使用图像,需要明确告知在这种情况下不要使用图像。

您实际上应该能够像这样设置它:

ul{
  list-style-image:url(images/green-checkmark.png);
  list-style-type:circle; /* back-up */
}

然后如果做内联:<ul style="list-style-image: none;">

于 2012-08-01T13:13:15.327 回答
2

您是否也尝试过覆盖列表样式图像?例如style="list-style-image: none; list-style-type:circle;"

不过,志豪是对的——这最好作为外部 CSS 中的类或更具体的选择器来完成。

于 2012-08-01T13:13:35.230 回答