媒体与视觉层 / TERM 257

背景毛玻璃Backdrop Blur

前层清晰，后层柔和模糊。

257

LIVE PREVIEW

VIEW✦SOFT GLASS

✦ MOTIONLEX

01 这个效果是什么

在滚动或弹层出现时，用半透明背景和模糊建立层次。

让顶部导航在页面滚动后变成半透明毛玻璃：内容从后方经过时轻微模糊，导航文字始终保持高对比；不支持 backdrop-filter 的浏览器显示不透明备用底色。