当前位置 : 主页 > 网页制作 > css >

css – filter:blur(1px);在Firefox,Internet Explorer和Opera中不起作用

来源:互联网 收集:自由互联 发布时间:2021-06-13
我有CSS的问题.当我尝试做的时候 -webkit-filter: blur(1px);-moz-filter: blur(1px);-ms-filter: blur(1px);-o-filter: blur(1px);filter: blur(1px); 它在Safari和Chrome中看起来很完美,但在Firefox,Opera或Internet Explorer中根
我有CSS的问题.当我尝试做的时候

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

它在Safari和Chrome中看起来很完美,但在Firefox,Opera或Internet Explorer中根本不显示模糊.这些浏览器是否支持它?或者是否有另一种让整个页面变得模糊的方法?

尝试使用SVG过滤器.

img {
  filter: blur(3px);
  -webkit-filter: blur(3px);
  -moz-filter: blur(3px);
  -o-filter: blur(3px);
  -ms-filter: blur(3px);
  filter: url(#blur);
  filter: progid:DXImageTransform.Microsoft.Blur(PixelRadius='3');
}
<img src="https://i.stack.imgur.com/oURrw.png" />

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