CSS實現頁面背景圖片模糊內容不模糊的方法

CSS實現頁面背景圖片模糊內容不模糊的方法

CSS實現頁面背景圖片模糊內容不模糊的方法
CSS實現頁面背景圖片模糊內容不模糊的方法,如果對你有幫助就看看吧,挺實用的一個CSS背景模糊效果,適合做一些非常唯美的網頁,給人一種很模糊卻又帶著一絲清晰的感覺。
原圖:
CSS實現頁面背景圖片模糊內容不模糊的方法
實例代碼:
 lang="en">

 charset="UTF-8">
</span><span class="pln">Document</span><span class="tag">

 type="text/css">
.banner_bg{
background:url(https://wl.aidezy.com/201911229534952007707.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);
}


 class="banner_box">
 class="banner_bg">
 class="banner swiper-container">
這里面是清晰的內容

人已贊賞
網絡教程

WordPress防止文章標題重復的插件教程

2019-12-1 22:42:59

網絡教程

WordPress 移除后臺管理界面右上角的幫助

2019-12-1 22:44:29

0 條回復 A文章作者 M管理員
    暫無討論,說說你的看法吧
個人中心
購物車
優惠劵
今日簽到
有新私信 私信列表
有新消息 消息中心
搜索
秒速飞艇是合法的吗