我可以应用CSS(3)过滤器只在图像部分吗? [英] Can I apply CSS(3) filters ONLY on image sections?
本文介绍了我可以应用CSS(3)过滤器只在图像部分吗?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我有全屏背景图片
.bg {
left: 0;
min-height: 100%;
min-width: 100%;
position: fixed;
top: 0;
z-index: -1;
}
并且想要应用CSS3过滤器,个人我想使用模糊在与我身体相同的位置。
and want to apply a CSS3 filter, personally I would like to use a blur effect, at the same position as my body
.container {
margin: 0 auto;
width: 1000px;
}
以下是一个示例:
我想通过模糊的容器写入文本。
I want to write text over the blurred container.
推荐答案
CSS
body {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
background: url(http://lorempixel.com/420/255) no-repeat center center fixed;
background-size: cover;
}
body:before {
left: 0;
right: 0;
margin-left:auto;
margin-right:auto;
content: "";
position: absolute;
height: 100%;
width: 500px;
background: url(http://lorempixel.com/420/255) no-repeat center center fixed;
background-size: cover;
z-index: -1;
filter: blur(5px);
-webkit-filter: blur(5px);
}
div {
height: 100%;
width: 450px;
margin: 0 auto;
}
这篇关于我可以应用CSS(3)过滤器只在图像部分吗?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文