html ul li 禁止样式,CSS-UL列表样式不适用

CSS-UL列表样式不适用

我有一个样式表，无论出于何种原因，都不会将list-style-type应用于UL元素。 我正在使用YUI的Grid CSS及其reset-fonts-grid.css文件，我知道将其作为CSS重置的一部分删除。

调用YUI之后，我调用了网站的样式表，其中包含UL的代码块：

ul {list-style-type: disc;}

我也尝试通过列表样式设置它，但得到相同的结果。 我知道上面的CSS块正在被读取，就像我添加了诸如padding或margins这样的东西一样。 Firefox或IE中都没有显示样式类型。

我应用于UL的唯一其他CSS在#nav div中，但是CSS不会触及list-style-type，它使用YUI提供的重置，并且YUI和网站样式表是仅有的两个CSS 被称为的工作表。

我还在网站的管理员端安装了FCKEditor，该编辑器的确显示了项目符号样式，因此我知道它必须与未由FCKEditor过滤的CSS有关。

13个解决方案

134 votes

您需要在CSS中添加以下内容：

li { display: list-item; }

这将触发Firefox显示光盘。

indubitablee answered 2020-07-01T11:12:37Z

36 votes

如果您正在使用的reset.css将所有空白设为null，那么您也可以给左空白：这意味着：

li {

list-style: disc outside none;

display: list-item;

margin-left: 1em;

}

假设您在重置后应用此CSS，它应该可以工作！

马修·里考(Matthieu Ricaud)

user415535 answered 2020-07-01T11:13:05Z

19 votes

如果我没记错的话，您应该将此规则应用于li，而不是ul。

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

steve_c answered 2020-07-01T11:12:13Z

19 votes

我遇到了这个问题，事实证明我在ul上没有任何填充，这阻止了光盘的可见性。

保证金也弄乱了

AJ Zane answered 2020-07-01T11:13:30Z

15 votes

确保没有应用“ li” overflow: hidden。

PipoPepino answered 2020-07-01T11:13:50Z

14 votes

此问题是由在父类中将li display属性设置为block引起的。 用list-item覆盖可以解决此问题。

tiberdoo answered 2020-07-01T11:14:10Z

3 votes

我遇到了这个问题，事实证明我在ul上没有任何填充，这阻止了光盘的可见性。

alimac83 answered 2020-07-01T11:14:30Z

3 votes

我的reset.css是margin: 0, padding: 0。经过数小时的查找和故障排除，此方法有效：

li {

list-style: disc outside none;

margin-left: 1em;

}

ul {

margin: 1em;

}

nara_l answered 2020-07-01T11:14:50Z

2 votes

您是否尝试过使用！important遵守规则？

FireBug显示哪个样式表具有对该元素的最后控制权？

这个住的地方可供其他人观看吗？

更新资料

我非常有信心，提供代码示例将有助于您更快地收到解决方案。 如果您可以将某个问题的示例上载到某个地方，或者提供标记以便我们可以在本地主机上对其进行测试，则您将有更好的机会获得一些有价值的输入。

问题的问题在于，他们导致他人相信提出问题的人具有足够的知识来提出问题。 在编程中，情况并非总是如此。 您可能错过了某些东西，或者意外跳了一下。 如果没有其他人关注您的代码，他们就必须假设您什么也没错过，什么也没忽略。

Sampson answered 2020-07-01T11:15:33Z

1 votes

我所能想到的是，事后超越这一点。

首先要包括重置样式，对吗？

dylanfm answered 2020-07-01T11:15:57Z

1 votes

在IE中，我只是使用“ normal_ol”类来设置ol列表的样式，并进行了如下所示的修改：

先前的代码：ol.normal_ol {float：left; 填充：0 0 0 25px; 保证金：0; 宽度：500像素；}ol.normal_ol li {font：normal 13px / 20px Arial; 颜色：＃4D4E53; 向左飘浮; 宽度：100％；}

修改后的代码：ol.normal_ol {float：left; 填充：0 0 0 25px; margin：0;}ol.normal_ol li {font：normal 13px / 20px Arial; 颜色：＃4D4E53; }

Somashree Patra answered 2020-07-01T11:16:27Z

1 votes

您所要做的就是将此类添加到CSS中。

.ul-no-style { list-style: none; padding: 0; margin: 0; }

将填充和边距设置为0极为重要。 相信我。

Jason answered 2020-07-01T11:16:52Z

0 votes

原来，YUI的重置CSS从“ ul li”中删除了列表样式，而不仅仅是“ ul”，这就是为什么将其设置为“ ul”从未起作用的原因。

dragonmantank answered 2020-07-01T11:17:12Z