答案

【问题标题】：
【发布时间】：2013-09-13 21:54:22
【问题描述】：

 这个和其他类似的 IE 代码行在 HTML5 文档中是什么意思？
如果我必须使某些 css 功能与 IE8 或更低版本兼容，上面提到的代码行或其中提到的 html 类是否有帮助？
如果 #2 的答案是“否”，那么我应该使用本文中提到的条件 IE 样式表 --http://css-tricks.com/how-to-create-an-ie-only-stylesheet/
如果 #3 的答案也是“否”，那么应该如何使 css 功能与旧 IE 版本兼容。任何参考网站/演示都会有很大帮助！

【问题讨论】：

你可以这样做 - 那些包装标签是 IE 唯一的条件语句标签，所有其他浏览器都会忽略它们（因为它们实际上只是 HTML cmets）。

标签： html css internet-explorer

【解决方案1】：

这是conditional IE statement。它们只能由 IE 读取。任何其他浏览器都会将它们视为任何普通注释，请分别注意语句开头和结尾的。 IE 具有识别此注释的特殊代码，并将注释中的内容用作常规 HTML。具体到您上面粘贴的代码，IE 条件语句将 ie6 类应用于 HTML 标记。通过这种方式，您可以通过首先在您的 css 选择器中引用该类来为 IE 仅提供某些元素的后备。例如，.ie6 #header {} 将仅在 IE6 类存在时应用于标头，并且由于条件语句，该类将仅存在于 IE6 中。
按照与上面相同的样式，您将使用这段代码：
如果您愿意，可以使用 IE 样式表，无论哪种方式，您都将获得基本相同的结果。我个人会将上述方法与 HTML 标记上的类一起使用，然后使用通常加载的单独的 css 文件，称为 ie.css。在此文件中，您将只有 IE 样式。请注意，使用此方法不需要在条件 IE 语句中设置样式表。作为一个单独的样式表的唯一真正目的是为了组织目的。如果您有中到大量的 IE 条件代码，我也只会这样做。如果您的 IE 后备代码最少，只需将代码包含在主样式表中正在修复的代码旁边即可。
你还可以使用Modernizr和Selectivizr之类的东西在一定程度上扩展IE支持

【讨论】：

我尝试在我的主样式表中为我的一个类创建一个 IE8 特定的 css 属性，但在 IE8 浏览器中没有反映任何输出。不确定我是否做错了什么，能否请您创建一个小提琴来演示，就像您在 #1 中所说的 .ie6 #header {} 一样。顺便说一句，描述得很好，很高兴知道 IE 的条件类和样式表之间的区别及其用法，谢谢！

【解决方案2】：

您在问题中讨论的所有示例都旨在检测浏览器是否为 IE（以及 IE 版本），然后尝试从那里处理它。

请注意，这不被视为最佳做法。

如果您需要处理浏览器差异和缺失功能，那么最好的处理方法是使用一种称为功能检测的技术，而不是浏览器检测。

我建议查找名为Modernizr 的库。对于您正在尝试做的事情，这几乎肯定是比您问题中的任何想法更好的起点。

为了修复特定的浏览器功能，Modernizr 团队还提供了a list of additional libraries called "polyfills"。找出您需要支持的功能，并查看列表以找到满足您需要的 polyfill 脚本。其中一些最好通过 Modernizr 加载；其他的可以自己运行。

除非万不得已，否则我会避免进行任何浏览器或版本检测。

使用 polyfill 时要记住的一点：旧版 IE 中缺少很多浏览器功能。还有一些 polyfill 脚本可以帮助您实现其中的大部分。但是，请不要认为您可以简单地包含每个 polyfill 并将旧 IE 版本变成更现代的浏览器。

简单的事实是旧的 IE 版本又旧又慢。添加 polyfill 会使它们变慢。您应该仔细考虑每个功能，并决定是否真的需要对其进行 polyfill。如果没有它，该网站仍然可以使用吗？在许多情况下，您最好让旧浏览器在没有某些功能的情况下运行。

【讨论】：

很高兴了解modernizr和polyfills，包括功能和浏览器检测。我经常阅读这些术语，但在这里的正确位置阅读它们让我更接近它们。嗯，到目前为止，我主要为 IE 使用了单独的样式表。但是现在想使用更合适的方式进行特征检测，是否有任何教程演示了 mordnizer 或 polyfills 的实时使用，这对我有帮助。感谢您的描述和强调每个的基础知识！
Modernizr 在他们的网站上有很好的文档。至于 polyfill 脚本，它们都是独一无二的；没有一套指令；您必须阅读要使用的文档。但是最好的 polyfill 使用起来非常简单。对于好的那些，它往往只是将脚本添加到您的站点的情况，仅此而已；缺少的功能开始在旧浏览器中工作，问题结束。不过有些更复杂；这取决于他们模拟的特性和 polyfill 本身一样多。

【解决方案3】：

正如@FDL 所指出的，如果您有适量的样式来应用各种版本的 IE，请使用条件样式表。

对于最小的定位调整，我使用 html 类（如 ie8 或 ie9）并将修改放入我的主样式表中。

例如：

.filter-bar .item { float: left; vertical-align: top; }
.ie8 .filter-bar .item { position: relative; top: 2px; } /* fix a gap in IE8 */

【讨论】：

【解决方案4】：

1) 这意味着如果您的 Internet Explorer 版本为 7 及以下，请在 html 标记中包含此类

2) 是的，你可以有这样的 css：

html.ie.ie6 .someClass {
 color: red;
}

仅当 IE 为 7 及以下版本时才会应用此功能

3) 你也可以这样做。有时您需要将两者结合起来

4) 不适用

【讨论】：

那个选择器有点多。我认为通过将其更改为 .ie6 .someClass