过滤器：模糊（1像素）;在Firefox，IE和Opera不工作 [英] filter: blur(1px); doesnt work in firefox, IE, and opera

问题描述

我有一个CSS问题：当我尝试做

I have a problem with css: when I try to do

-webkit-filter: blur(1px);
-moz-filter: blur(1px);
-ms-filter: blur(1px);
-o-filter: blur(1px);
filter: blur(1px);

它会在Safari和Chrome完美，但模糊犯规出现在Firefox，Opera或IE浏览器在所有。做那些browers支持呢？还是有让整个页面模糊的另一种方法？

it looks perfect in safari and chrome, but the blur doesnt show up at all in firefox, opera, or IE. Do those browers support it? Or is there another method of getting the entire page to blur?

推荐答案

尝试用SVG滤镜。

filter: url(blur.svg#blur); }

SVG：

<svg version="1.1" xmlns="http://www.w3.org/2000/svg">
   <filter id="blur">
       <feGaussianBlur stdDeviation="3" />
   </filter>
</svg> 

完整的CSS：

filter: blur(3px); 
-webkit-filter: blur(3px); 
-moz-filter: blur(3px);
-o-filter: blur(3px); 
-ms-filter: blur(3px);
filter: url(blur.svg#blur);
filter:progid:DXImageTransform.Microsoft.Blur(PixelRadius='3');

这篇关于过滤器：模糊（1像素）;在Firefox，IE和Opera不工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！