4

我想开始使用一些 HTML5 标签，但担心它会如何在不支持 HTML5 的浏览器上呈现。似乎 html5shiv 是我可以用于 IE 浏览器 < 9 的解决方案。

但是，如果浏览器不支持 HTML5 并且不是 IE 怎么办？然后怎样呢？为什么 html5shiv 是 IE 的东西？

4

4 回答 4

8

首先，需要明确的是，html5shiv 只是为了让您可以正确设置某些 HTML5 标记（section、article等）的样式。它没有为浏览器提供任何更一般意义上的“HTML5 支持”。

考虑到这一点，请注意 IE <9 是唯一不允许正确设置这些 HTML5 标记样式的浏览器，因此 html5shiv 仅适用于它们。

其他浏览器（甚至像 Netscape Communicator 4 这样的非常老的浏览器）仍然会正确解析无法识别的标签，并允许 CSS 像您期望的那样应用于它们。

正如 zzzzBov 在他的回答中指出的那样，它们可能没有正确的默认样式（在大多数（所有？）情况下要么是要么display: block没有），所以即使是非 oldIE 浏览器也需要添加这些样式。但是这样做在非 oldIE 浏览器中效果很好，而在 oldIE 中，添加这些默认样式（或任何样式）只有在使用 html5shiv 时才有效。

于 2012-05-02T04:47:23.810 回答
4

display元素属性的初始值为inline( ref )。内置的用户代理样式表将属性更改为已知元素的合理值；例如，标题和段落被更改为块。

HTML5 引入了新元素，例如页眉、页脚、文章和部分（HTML5 分段元素）。由于较旧的浏览器不知道它们，因此它们将这些元素视为内联元素。因此，您必须手动为这些元素添加 CSS 规则：

header, footer, article, section { display: block; }

但正如HTML5 Shiv 的故事中提到的：

...Internet Explorer 6-8 存在问题，因为它们无法识别未知元素；新元素不能容纳子元素并且不受 CSS 影响

该文章还提到了 IE 6-8 的解决方法：

顺便说一句，如果您希望 CSS 规则适用于 IE 中的未知元素，您只需执行 document.createElement(elementName)。这以某种方式让 CSS 引擎知道具有该名称的元素存在

现在，关于您的问题： html5shiv使用一些 JavaScript 技巧使未知元素在 IE 6-8 中具有样式。至于其他不支持 HTML5 的浏览器，如果需要，html5shiv 会添加正确呈现 HTML5 元素所需的默认样式，这样您就不必自己定义 CSS 规则（如上所述）。

请注意， html5shiv不会使浏览器支持 HTML5。例如，它不能让 IE7 播放通过 HTML5<video>标签嵌入的视频。

于 2012-05-02T08:02:29.757 回答
2

display其他浏览器只需设置它们的 css属性即可支持非标准元素：

header,
footer,
article,
section,
...etc... {
    display: block;
}

对于旧版本的 Firefox 和基于 webkit 的浏览器（HTML5 之前），这就是所有必要的。

于 2012-05-02T04:47:26.450 回答
0

htmlshiv 是一个“IE”的东西，因为某些版本的 IE [仍然] 缺少许多 HTML5 功能。在 chrome 或其他 webkit 浏览器中有效的东西可能在 IE 中无效，因此 htmlshiv 尝试对缺少的功能进行 javascript 改编。准确地说，它也是一个 polyfill。

于 2012-05-02T04:47:54.717 回答