CSS:Internet Explorer 中的简单渐变 <= 8

Question

我相信你们都知道，Internet Explorer 可以处理简单的渐变。这是 Twitter Bootstrap 的一个片段，例如:

filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#e6e6e6', GradientType=0);

但是，我看到有些人使用两种 CSS 规则(一种用于 IE < 8，一种用于 IE 8)，如下所示:

filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#7fbf4d', endColorstr='#63a62f'); /* For Internet Explorer 5.5 - 7 */
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#7fbf4d', endColorstr='#63a62f')"; /* For Internet Explorer 8 */

我的问题是，第二条规则真的有必要吗？ Twitter Bootstrap 非常彻底，但它不使用任何“-ms-filter”规则。根据this page ，-ms-filter 属性是 CSS 的扩展，在 IE8 标准模式下可以用作 filter 的同义词。

Answer 1

我的建议:

使用 CSS3Pie -- http://css3pie.com/

这是一个用于 IE6、IE7 和 IE8 的 JavaScript 库，通过补丁支持多种 CSS3 功能，包括渐变。

是的，您可以根据需要使用可怕的 IE 特定 filter 样式，但 CSS3Pie 允许您为这些功能使用标准 CSS 样式。容易多了。

实际回答您的直接问题:

是的，通常需要 -ms-filter 样式。 IE8 将始终使用它，而不是 filter，它主要用于 IE6 和 IE7。在某些情况下 filter 会在 IE8 中工作，但不是全部，所以最好使用 -ms-filter 以确保 IE8 兼容性。

[编辑] 他们为什么要改变它？因为当他们发布 IE8 时，Microsoft 非常重视尝试“符合标准”。

要使浏览器符合标准，它应该为它支持的任何 CSS 属性使用供应商前缀，而这些属性不是最终的 W3C 标准。因此，通过添加 -ms- 前缀，Microsoft 试图(迟来的)消除他们对全局 CSS 命名空间的污染。

此外，添加了引号，因为没有引号的旧 filter 语法是无效的 CSS(主要是因为 progid 之后的冒号)，并导致问题一些浏览器。 (前段时间我有一个关于 Firefox 3.6 的例子，它丢弃了所有遵循旋转元素的 filter 样式的样式 - 花了很长时间才弄清楚发生了什么)。

Microsoft 保留与原始 filter 语法的向后兼容性这一事实在很大程度上是实用主义的问题。 MS 无法承受使用旧语法破坏所有站点的后果。但是 Microsoft 强烈暗示开发人员应该同时使用这两者，因为他们会在 IE 的后续版本中放弃对旧的 filter 样式的支持。事实证明，他们一举放弃了对 filter 和 -ms-filer 的支持，但在 IE8 发布时给出的暗示足以让它成为在样式表中提供这两种语法的推荐做法。

在 IE8 发布时，XHTML 是当月的新风尚，编写能够完美验证的代码是许多开发人员的首要任务。这可能是语法更改以包含引号的强大插入力。由于杂散的冒号，不可能编写使用旧的 filter 样式进行验证的 CSS。使用新的 -ms-filter 样式可以让人们编写有效的 CSS。就好的想法而言，这个想法并没有真正奏效，因为人们当然不得不继续使用旧语法，但意图是好的。

值得指出的是，其他专有样式也得到了相同的处理。例如，您可以在 IE8 中使用 -ms-behavior 而不是旧的 behavior 样式。没有人使用它。为什么？我真的不知道。

另一个值得了解的事实是 W3C 正在对 CSS property called filter 进行标准化。 .它将完成与 Microsoft filter 风格完全不同的工作，并且工作方式完全不同。如果/当它被标准化并且浏览器开始支持它时，这两种语法之间将会发生明显的冲突。