class
="comment-bk"
>
class
="top-blur"
>
div>
class
="top"
>
>
class
="iconfont icon-pinglun"
>
i>
li>
div>
>
"comments"
>
div>
div>
div>
.comment-bk}}
#comments
.top-blur
}.top
}
（一）在想要出線毛玻璃效果的div中用背景繼承
background: inherit;（二）在上述div的after偽類中使用模糊效果
&::after
content:'';
這裡偽類我的高寬都適當放大，這樣做的目的是為了讓下面平移時候更方便，也就是margin: -30px 0 0 -30px;可以理解成向左上移動。
那麼問題來了我們為什麼要平移呢，背景躺著好好的，就不能舒服一點嗎，不動它不行嗎，哈哈還真有點問題，可能有點強迫，要是直接用模糊效果，你會發現div的四周就是邊緣的位置模糊效果不是很好，或者說就沒有模糊，所以這樣一移動模糊效果就槓槓滴，四周看上去模糊的完美。
css毛玻璃效果
毛玻璃其實就是磨砂玻璃，能夠模糊的看清背後的風景，讓人感覺有種朦朧美，讓介面看上去有些層次感。比如 高大上啊，接下來肯定是眼饞手癢的過程。當然，用ps搞乙個全景毛玻璃背景毫無疑問是最省事的，那接下來就沒啥事可幹了。當然no no no了。毛玻璃無疑就是種模糊了，少不了filter blur。最終效果...
css3毛玻璃模糊效果
css3 blur濾鏡實現 如下測試 需要注意目前火狐不支援，其他些瀏覽器，如firefox到目前還沒有支援css3 filter.當然，要實現 比方說 firefox 24瀏覽器上 變模糊的效果，也是可以的。可以使用svg的模糊濾鏡。新建文命名為blur.svg的svg檔案 xml version...
css實現毛玻璃效果
首先我們要知道實現毛玻璃效果的關鍵點 filter濾鏡 html 先寫乙個居中的div，並給body加上背景圖，以及居中的div設定背景顏色和透明度 body,html main 這裡我們不在此元素上寫filter屬性是因為其會導致內容的透明度改變，所以使用乙個可行的方法是為其新增偽元素效果如下圖 ...