backdrop-filter 与 filter 的区别
filter:模糊内容
backdrop-filter:透过该层的底部元素模糊化
这两个属性的语法是一样的
写法
backdrop-filter: saturate(150%) contrast(50%) blur(8px);
background-color: rgba(0, 0, 0, 0.3);
saturate(150%)意为使…饱和,类似 ps 饱和度效果,小于 100%变暗,大于 100%变亮
contrast(50%)意为对比,类似 ps 对比度,100%为原图,0%为全灰色图像
使用效果
亮色背景
暗色背景