1、毛玻璃實現方法：
css3 blur濾鏡實現
如下測試**：
.blur {
-webkit-filter: blur(10px); /* chrome, opera */
-moz-filter: blur(10px);
-ms-filter: blur(10px);
filter: blur(10px);
需要注意目前火狐不支援，其他些瀏覽器，如firefox到目前還沒有支援css3 filter. 當然，要實現(比方說)firefox 24瀏覽器上**變模糊的效果，也是可以的。可以使用svg的模糊濾鏡。
新建文命名為blur.svg的svg檔案：
xmlns=""
xmlns:xlink=""
xmlns:ev=""
baseprofile="full">
如下css呼叫**：
filter: url(blur.svg#blur); /* firefox, chrome, opera */
完整的css**
.blur {
filter: url(blur.svg#blur); /* firefox, chrome, opera */
-webkit-filter: blur(10px); /* chrome, opera */
-moz-filter: blur(10px);
-ms-filter: blur(10px);
filter: blur(10px);
filter: progid:dximagetransform.microsoft.blur(pixelradius=10, makeshadow=false); /* ie6~ie9 */
2、解決白邊方式
原理很簡單就是在要模糊的下面在定位一張相同的，當要模糊的縮小時，就會顯示出低下的那張圖。。。白邊就不見了，哈哈哈。。。你想到了嗎？
原文：
解決css3毛玻璃效果 blur 有白邊問題
做乙個登入頁，全屏背景圖毛玻璃效果，實現方法如下 html css login wrap login mask login box 效果如下 可以發現邊上是有白邊的，這是一種blur的值很大的情況下。此時的解決方法是直接將background size cover 改成background size...
解決css3毛玻璃效果 blur 有白邊問題
做乙個登入頁，全屏背景圖毛玻璃效果，實現方法如下 html css login wrap login mask login box 效果如下 可以發現邊上是有白邊的，這是一種blur的值很大的情況下。此時的解決方法是直接將background size cover 改成background size...
css3毛玻璃模糊效果
css3 blur濾鏡實現 如下測試 需要注意目前火狐不支援，其他些瀏覽器，如firefox到目前還沒有支援css3 filter.當然，要實現 比方說 firefox 24瀏覽器上 變模糊的效果，也是可以的。可以使用svg的模糊濾鏡。新建文命名為blur.svg的svg檔案 xml version...