我的html不知道搞什么，字体特别模糊，图片没事

看不到样式表 但从样式推断可以判断 文字后边有透明度的黑色背景层 应该和文字同级 或者背景用rgba写法直接写透明度 否则父元素的透明度会让字体也跟着透明导致模糊

例 background: rgba(0,0,0,0.8)

所谓的毛玻璃效果其实是半透明+模糊，可以用CSS filter实现。

时间不多，就抛个砖，题主可以自己找一下文档和更多案例。

filter - CSS

div {

-moz-filter: blur(5px)

-webkit-filter: blur(5px)

-o-filter: blur(5px)

-ms-filter: blur(5px)

filter: blur(5px)

}

大体思路是，当出现d出层的时候，对背景层增加blur filter，再给d出层的一定透明度就可以了。

因为有同学坚持说 CSS filter 只能用于图片，所以录了一个小视频，证明它是可以用于可视的DOM元素的。

在 codepen 上找了一个栗子，是通过CSS filter + JS复制滚动元素实现的毛玻璃 Nav Bar 效果，也可以说明，这个属性真的不是只能作用于图片，也不需要“截屏”啊。

---