UL列表样式不适用

Question

我有一个样式表,无论出于何种原因,都不会将list-style-type应用于UL元素.我正在使用YUI的Grid CSS和他们的reset-fonts-grid.css文件,我知道这些文件是CSS重置的一部分.

在调用YUI之后,我调用了网站的样式表,并且有一个UL块:

ul {list-style-type: disc;}

我也试过通过list-style设置它但获得相同的结果.我知道上面的CSS块被读取就好像我添加了填充或边距之类的东西.样式类型未显示在Firefox或IE中.

我应用于UL的唯一其他CSS是在#nav div中,但是CSS没有触及list-style-type,它使用了YUI提供的重置,而YUI和网站样式表是唯一的两个CSS被称为的床单.

我在网站的管理员端也有FCKEditor,该编辑器确实显示了子弹样式,所以我知道它必须是CSS没有被FCKEditor过滤的东西.

Answer 1

您需要在css中包含以下内容:

li { display: list-item; }

这会触发Firefox显示光盘.

Answer 2

如果你使用的reset.css使所有边距为空,你也可以给左边距:这意味着:

li {
list-style: disc outside none;
display: list-item;
margin-left: 1em;
}

假设您在重置后应用此css ,它应该工作!

Matthieu Ricaud

Answer 3

如果我没有弄错的话,你应该将这个规则应用于li,而不是ul.

ul li {list-style-type: disc;}

你误会了.它适用于ul.http://www.w3.org/TR/CSS21/generate.html#list-style (31认同)
w3链接似乎现在只说这适用于display-type设置为'list-style-item'的任何元素,MDN对此有一些澄清,建议使用默认样式表,它实际上是应该具有此规则的LI: https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type也许并不奇怪我发现在UL级别应用它的情况在Chrome中工作但在Firefox中没有.在LI处应用它在两者中都有效. (2认同)
添加 `display: list-item;` 解决了我的问题。 (2认同)

Answer 4

我遇到了这个问题,原来我在ul上没有任何填充,这阻止了光盘的可见性.

保证金也与此混淆

Answer 5

确保'li'没有overflow: hidden应用.

Answer 6

此问题是由父类中li display设置的属性引起的block.覆盖list-item解决了问题.

Answer 7

我的reset.css是margin: 0, padding: 0。经过几个小时的查找和故障排除后，这奏效了：

li {
    list-style: disc outside none;
    margin-left: 1em;
}

ul {
    margin: 1em;
}

Answer 8

我遇到了这个问题，结果发现我的 ul 上没有任何 padding-left，这导致光盘不可见。ul 元素的默认 padding-left 是 40px。

和元素的顶部和底部边距为 16px (1em)，左内边距为 40px (2.5em)。