如何用css实现高斯模糊

发表:2年前 更新:1年前

在 CSS 中,可以使用 filter 属性来实现高斯模糊效果。具体的,你可以这样写:

element {
  filter: blur(5px);
}

上面的代码会使 element 元素变得模糊,模糊程度由参数 5px 指定。你可以更改参数来调整模糊程度,如 10px 会使元素更加模糊。

注意:

  • filter 属性在所有主流浏览器中都是支持的,但是在 Internet Explorer 中,它只在版本 10 及以上的浏览器中支持。
  • 在移动端的浏览器中,filter 属性可能会带来性能问题。

如果你希望在移动端浏览器中使用高斯模糊效果,你可以使用 CSS3 的 backdrop-blur 属性。例如:

element {
  backdrop-blur: 10px;
}
signature
保持理智

全部评论

mos

发表 :2年前

厉害厉害

评论

无权限

请登录后评论

RunPod公众号

赞助商

联系我们

QQ群:798695907

邮箱:laravel@88.com