0

我注意到在 IE 8 及更低版本中，我的标题消失了，我的列表变得没有样式。

意思是，它们看起来与应有的不同，并且有子弹。

为什么会发生这种情况，我该如何解决。

我知道我还没有包含 html5 shim / html5 shiv，这会导致标题消失吗？我的<main>元素和列表样式呢？

这是发生这种情况的页面的链接：https ://dl.dropboxusercontent.com/u/270523/help/search/new.html

这是它在 IE8 中的样子：http: //pageaffairs.com/sp/so-16270338.png

4

2 回答 2

1

较旧的 IE 不会呈现 HTML5 标记，因此您应用于它们的样式将被忽略。（它们甚至不会渲染为像“哦，好吧，让我们假装它是一个 div”这样的块。不，它完全被忽略了）。

是的，正如您所说，最好将html5shiv添加到代码的标题中，如下所示：

<!--[if lt IE 9]>
<script src="path/to/your/shiv.js"></script>
<![endif]-->

这意味着if lower thanIE 9应用此脚本。

此外，CSS3 的东西也会发生同样的情况，比如border-radius 和其他东西。为此，请使用方便的 CSS3Pie。

.someRoundCorner {
    border-radius:4px;
    behavior:url(path/to/css3pie/htc);
}

作为建议，如果您的主要受众使用 IE < 9，则暂时仍使用与id您实际想要的 HTML5 标签相同的 div。比使用 .js 更好（如果禁用 .js，布局将像现在一样中断） . 当旧的 IE 不再受支持时，将更容易搜索和替换 id 等于您想要的标签的文档。

更新：您的 css 是main ul, [role="main"] ul, #main ul，但由于 IE 不知道标签 main 是什么，它会将 UL 抛出，因此您的 CSS 选择器不匹配。在这张图片中看到他不知道的所有元素，他都变成了一个空元素：

IE8开发者工具及源代码

左边是它实际渲染的代码，而右边是真正的源代码。如您所见，UL 已超出main.

于 2013-04-29T21:40:46.747 回答
1

如this question's accepted answer所示，IE8 不能很好地处理 HTML5 元素。它不仅没有设计这些元素的样式，而且有时（如您所见）使它们似乎完全消失了。我在我的团队开发的网站上亲眼目睹了这一点。IE8 将<section>我们使用的所有标签都变成了<section />.，这只是弄乱了我们所有的内容和样式。您将需要使用HTML5 shiv 脚本来使其工作（Modernizr为我们修复了它，HTML5 shiv 脚本只是其中的一部分，但您可能至少只需要 shiv 脚本）。

于 2013-04-29T21:41:06.720 回答