记得替换图片才能看见效果哦
filter:blur(20px);
滤镜:模糊(20px);
css:
body { min-height:100vh; box-sizing:border-box; margin:0; padding-top:calc(50
vh -6em); font:150%/1.6 Baskerville,Palatino,serif; } .bg_img h3 { font-size:18
px; color:#ffffff; } .bg_img p { font-size:14px; color:#ffffff;
font-variant-ligatures:common-ligatures discretionary-ligatures
historical-ligatures; } body,.bg_img::before { background:url("images/bg.jpg") 0
/ cover fixed; } .bg_img { position:relative; margin:0 auto; padding:1em;
max-width:23em; background:hsla(0,0%,100%,.25) border-box; overflow:hidden;
border-radius:.3em; 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); } .bg_img::before {
content:''; position:absolute; top:0; right:0; bottom:0; left:0; margin:-30px;
z-index:-1; -webkit-filter:blur(20px); filter:blur(20px); }
html:
<div class="bg_img"> <h3>背景模糊</h3> <p>
背景模糊背景模糊背景模糊背景模糊背景模糊背景模糊背景模糊背景模糊背景模糊背景模糊背景模糊背景模糊背景模糊背景模糊背景模糊背景模糊背景模糊背景模糊</p> </
div>

技术
©2019-2020 Toolsou All rights reserved,
一个名叫“讨火车”的小村子 终于把火车讨来了c++内存 指针越界检测机制_CrtMemBlockHeade错误总结-myBatis plus 分页记一次EventBus内存泄露导致的项目问题服务器价格有什么差异?Android中获取当前正在显示的Activity实例创建数据mysql库流程在Vue中使用Web Worker最优化方法总结:公式解、数值优化、求解思想使用easyPOI导入Excel数据