backdrop-filter实现磨砂玻璃效果

html-css020

backdrop-filter实现磨砂玻璃效果,第1张

css的backdrop-filter简介：

https://www.zhangxinxu.com/wordpress/2019/11/css-backdrop-filter/

https://developer.mozilla.org/zh-CN/docs/Web/CSS/backdrop-filter

backdrop-filter可实现毛玻璃(磨砂)的效果，但可能兼容性不好，尤其安卓移动端，

大致效果如下：

绘制简单三角形

如下所示：

只是用到了css滤镜(filter)中的blur属性。

CSS中的毛玻璃特效主要使用了filter属性里的blur（）函数，也就是高斯模糊滤镜。

但是要做一个好的毛玻璃效果，需要注意很多细节。