Html
    Css
    Js

    
                        
 * {
	margin:0;
	padding:0;
}
body {
	width:100%;
	height:100%;
	height:auto;
}
body,.content::before {
	background:url(http://www.jq22.com/img/cs/500x300-9.png) 0 / cover fixed;
}
.content {
	width:800px;
	position:relative;
	margin:2rem auto;
	padding:1em;
	background:hsla(0,0%,100%,.25) border-box;
	overflow:hidden;
	border-radius:8px;
	box-shadow:0 0 0 1px hsla(0,0%,100%,.3) inset,0 .5em 1em rgba(0,0,0,0.6);
	text-shadow:0 1px 1px hsla(0,0%,100%,.3);
}
.content::before {
	content:'';
	position:absolute;
	top:0;
	right:0;
	bottom:0;
	left:0;
	margin:-30px;
	z-index:-1;
	-webkit-filter:blur(10px);
	filter:blur(10px);
}

                        
↑上面代码改变,会自动显示代码结果 jQuery调用版本:2.1.4
 立即下载

css毛玻璃效果

0