Modernizr、html5shiv、ie7.js 和 CSS3 Pie。使用哪个以及何时使用？答案

【问题标题】：Modernizr, html5shiv, ie7.js, and CSS3 Pie. Which to use and when?Modernizr、html5shiv、ie7.js 和 CSS3 Pie。使用哪个以及何时使用？
【发布时间】：2011-08-05 17:48:15
【问题描述】：

我刚刚开始在我的文档中使用 HTML5 和 CSS3。我了解 JavaScript 需要让 Internet Explorer 跟上这些新标签和样式的速度，但我不知道该使用哪个以及何时使用！

我的计划是使用 html5shiv 和 IE9.js 来处理 HTML5 标签以及透明 png（以及它们修复的任何其他讨厌的错误），但后来 Modernizr 和 CSS3 Pie 引起了我的注意。

我的问题是，如果我使用 Modernizr，它会满足我对 html5shiv 和 IE9.js 的需求吗？或者我也应该包括这些？重叠是什么？

CSS3 Pie 做了什么 Modernizr 或其他没有做的？还是反过来？

感谢你们的帮助。让我知道你在做什么！？

【问题讨论】：

在这里也可以看到一个非常相似的问题：stackoverflow.com/questions/3855294/…
关于 CSS3PIE，你不需要使用 Modernizr 来做“条件 JS 加载”，因为只有 IE 浏览器最多 9 会加载 PIE 库。见stackoverflow.com/questions/5609651/…和stackoverflow.com/questions/8545501/…

标签： javascript internet-explorer html modernizr css3pie

【解决方案1】：

我在所有这些方面都有丰富的经验，每个都使用了几年。

Modernizr

包括 HTML5shiv 功能还有更多功能 - 如果您不使用其他功能，请不要使用它，它会减慢页面加载速度，但如果您需要，它是值得的！

HTML5shiv

很小，只是修复了IE中的html5元素，没有别的。

CSS3PIE

允许您在旧版本的 IE 中使用边框半径、渐变和框阴影。也可以在 IE 6 中允许 PNG。显着延迟页面加载。

ie7.js（和 ie9.js）

为您提供许多 CSS3 选择器、最小和最大宽度、多个类和固定定位。如果您愿意，也可以进行 png 修复。似乎并没有减慢速度。

结论

我的建议分为两类：

如果您只是使用新的（互联网上是 2 年新的？！）元素和 CSS3 选择器，那么使用 ie9.js + html5shiv。这是轻量级的，只是让您可以继续做事，而不必记住 IE6 不支持任何东西。

如果你使用了很多 CSS3 的东西，那么 CSS3PIE 会整理出border-radius 和 box-shadow。渐变支持似乎有点不稳定，所以我一直使用后备图像。 Modernizr 让您可以轻松地向具有不同支持的浏览器提供不同的属性。我主要使用它来确定浏览器是否具有 CSS 过渡和变换，因为它们对于任何图像滑块或内容轮播都很有用。值得使用自定义工具来仅包含您想要的功能 - 网络表单内容会在几毫秒内显示一个包含 50 的文本框，因此如果您不想要它，则值得禁用它。

希望对你有帮助！

【讨论】：

确实很有帮助！谢谢你。最后一个问题，我从你所说的理解，如果我选择使用 Modernizr，它将满足对 html5shiv 的需求，但是 ie9.js 呢？如果我使用 Modernizr，我还应该使用 html5shiv 来处理透明的 png 等吗？ CSS3 PIE 也是如此，它是否关注 html5shiv 或 ie9.js 的功能？我只想使用我需要的页面，所以知道什么是多余的会很有帮助。

【解决方案2】：

我建议你只使用你需要的东西。在支持您正在使用的功能的浏览器中构建您的应用程序，并定期在您支持的其他浏览器中进行测试。如果某些东西不能正常工作，请找到适当的修复程序，无论是 html5shiv、IE9.js、Modernizr 还是 CSS3 Pie。您不会在一个页面中使用 HTML5 和 CSS3 中的所有新功能，因此您不需要包含所有现有的 polyfill 库。等到您发现您尝试使用的功能存在问题时，然后尝试找到执行此操作所需的库。

【讨论】：

感谢您的建议。这当然是有道理的。

【解决方案3】：

我主要使用 CSS3Pie...效果很好。但是今天下午我用 I.E8 在我的笔记本电脑上对其进行了测试，但它出现了问题......它禁用了一些 css 行......当我删除 css3pie 代码时，我的网站速度提高了一倍......然后我来了与人们争论 css3 减速的帖子越过......所以目前我正忙着为 IE7 和 IE8 寻找另一种方法来获得边框半径和阴影。

如果你想使用它...请多多测试，因为它是非官方修复

【讨论】：

IE7-IE8 的替代方案是没有圆角，或者切换到图像......（虽然，你可以使用 css3pie 背后的一些底层技术。我最近去了根本不旧版浏览器的圆角边框。我自己使用modernizr + ie9.js，因为我将使用modernizr 提供的许多额外目标。