CSS3 过滤器不适用于 Opera、Internet Explorer、Mozilla Firefox [关闭]答案

【问题标题】：CSS3 filter doesn't work on Opera,Internet Explorer,Mozilla Firefox [closed]CSS3 过滤器不适用于 Opera、Internet Explorer、Mozilla Firefox [关闭]
【发布时间】：2014-09-12 13:23:05
【问题描述】：

CSS 有命令 filter 并且它有很多功能示例：

  filter: grayscale(0);
  filter: sepia(0);
  filter: saturate(1);
  filter: hue-rotate(0deg);
  filter: invert(0);
  filter: opacity(1);
  filter: brightness(1);
  filter: contrast(1);
  filter: blur(0px);

过滤器支持 Chrome 18+、Safari 6+。（来源：http://css3.bradshawenterprises.com/filters/）

我需要使用灰度、棕褐色、饱和度、亮度、对比度、模糊。我不能使用这些，因为很少有浏览器（即 mozilla、opera）不支持 filter

我的问题：也许这些函数有替代方法或其他方法来获得类似的结果，例如：灰度、棕褐色、饱和度、亮度、对比度、模糊

我尝试什么：添加前缀：-moz-, -o-, -ms-

来自微软官方网站的示例，但不起作用：/ 来源：http://msdn.microsoft.com/en-us/library/ms532847(v=vs.85).aspx) 像这样：

filter:progid:DXImageTransform.Microsoft.MotionBlur(strength=50)
        progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1); width=50%

有趣的是。我找到了 internet explorer 的解决方案：6,7,8（来源：http://www.smashingmagazine.com/2010/04/28/css3-solutions-for-internet-explorer/）我尝试为我的 internet explorer 11 测试它，但它不起作用。代码：

filter:  progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#81a8cb', endColorstr='#4477a1'); /* IE6 & IE7 */
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#81a8cb', endColorstr='#4477a1')"; /* IE8 */

我需要找到一个至少在最新版本的 Mozilla、Opera、Internet Explorer 上运行的解决方案

【问题讨论】：

过滤器是 IE 独有的东西，它永远不会在其他浏览器中工作
Opera 支持带有-webkit- 前缀的过滤器。我在 Opera 上，this 演示对我来说效果很好。
Teo，我的过滤器适用于 chrome 和 safari，但不适用于 ie、mozilla 和 opera
@Teo：在 SVG WG 决定将 SVG 过滤器移植到 CSS 之前，它一直是 IE 专有的，这就是这个问题的意义所在。 -ms-filter 仍然是 IE 专有的，但我相信他们现在迫不及待地放弃它，转而使用 SVG 过滤器。
我也有这个问题和过滤器在 IE 上工作。您是否以某种方式修复了@Asker？谢谢

标签： html css browser css-filters

【解决方案1】：

http://caniuse.com/#search=filter

据我所知，直到 IE v11，IE 都不支持 CSS 滤镜效果。 Firefox 有部分支持。 Opera v24 及更高版本完全支持 -webkit- 前缀。

【讨论】：

也许 Opera 还不错，但基本问题是 internet explorer 和 mozilla..

【解决方案2】：

Mozilla Firefox：support without prefix is coming in Firefox 34 according to MDN（稳定版目前为 32）。几周后，如果我理解得很好，您将需要通过 url() 的 SVG 过滤器。

注意：如果您支持 Firefox ESR - Extended Support Release - 可能由相当多的 IT 部门和组织部署，Fx 24 ESR 将在 2014 年 10 月之后不受支持，但 Fx 31 ESR 将持续到 2015 年中或年底我猜。 (source)

【讨论】：