css实现毛玻璃效果

废话：前端时间boss提了一个需求，非要实现一个毛玻璃效果，查阅了各种资料，倒是有方法就是比较复杂，后来综合考虑不要了，结果过了一段时间，又说要了。（心里一阵不爽.....），后来经过不懈努力终于找到了一个简单方法。这里安利一下。

<div class='mask'></div>

.mask{
	-webkit-backdrop-filter: blur(2px);	
	backdrop-filter: blur(2px);
}


这就OK了，实在是太他妈方便了，感谢各位底层编码人员，感谢各大Tv,泪崩。。。。

效果图： 补充说明：可能会有兼容性问题，使用起来需注意，本身css3就有兼容性问题。可以通过调整blur的值来改变模糊程度，值越大，越模糊。