CSS实现页面背景图片模糊内容不模糊的方法,如果对你有帮助就看看吧,挺实用的一个CSS背景模糊效果,适合做一些非常唯美的网页,给人一种很模糊却又带着一丝清晰的感觉。
代码:
Document
.banner_bg{
background:url(/1122953495707.jpg);
width:1000px;
background-repeat:no-repeat;
background-size:cover;
-webkit-filter:blur(15px);
-moz-filter:blur(15px);
-o-filter:blur(15px);
-ms-filter:blur(15px);
filter:blur(15px);
position:absolute;
left:0;
top:0;
height: 500px;
}
.swiper-container{
position: relative;
top:200px;
left: 300px;
color: white;
font-size: 36px;
font-weight: 700;
text-shadow: 0 2px 20px rgba(0, 0, 0, .1);
}
这里面是清晰的内容
如果觉得我的文章对你有用,请随意赞赏
感谢您的支持,我会继续努力的!
扫码打赏,你说多少就多少
打开或者扫一扫,即可进行扫码赞赏哦