Question

这让我疯了。这是我在示例页面上的一些HTML和CSS。第一个意图是没有任何标记的LI。我已尽力而为，但列表项目将显示标准小数点。我使用IE9附带的开发人员工具来检查UL和LI元素。似乎IE根本没有识别“recentAnnouncementsList”css类。这些元素不显示应用于其上的样式。整个设置在Chrome上完美运行。我错过了什么？

由于

ul.recentAnnouncementsList
{
    margin-left: 0px;
    padding-left: 5px;
}

ul.recentAnnouncementsList li
{
    margin-left: 0px;
    padding-bottom: 5px;
    list-style-type:none;
}

ul.recentAnnouncementsList li a{
    color:#675DF0;text-decoration:none; font-size:0.85em;
}

ul.recentAnnouncementsList li span{
    display: block;
    text-indent: 0px;
    text-transform: none;
}

<td>
<div>
<ul class="recentAnnouncementsList" id="recentAnnouncements">
<li><a href="#">Released 1</a></li>
<li><a href="#">Release 2</a></li>
</ul>
</div>
</td>

Answer 1

最后我解决了这个问题。问题是我在文件中添加了一个名为“container”的新CSS类。我不确定这是否是IE和FF中的一些错误，但CSS文件在该样式的开头被修剪。我通过查看IE的开发人员工具找到了这个。当我在IE中查看加载的文件时，它没有完成。所有与我的UL / LI标签相关的样式都出现在该类定义之后。从文件中删除“容器”类后，一切都恢复正常。

感谢您的所有意见和建议。

Answer 2

对于我的项目我曾经通过使用html

元标记呈现IE9作为IE8

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8"/>

所以同样的css适用于两者

Answer 3

IE 6-9都限制了CSS文件中声明的选择器数量。我假设为.recentAnnouncementsList声明的样式位于限制之上并完全被忽略。有些工具可以帮助将大型CSS文件分成几个部分，并将选择器的数量保持在一个低于限制的文件中：

blesscss - 命令行工具
css_splitter - 适用于Rails应用
gulp-bless - 适用于NodeJS项目

IE9中无法识别CSS样式

3 个答案: