变暗的CSS背景图像？
变暗的CSS背景图像？
提问于 2014-10-29 09:44:30
这应该是一个相当简单的问题。在我的网站上，我这样做：
#landing-wrapper {
display:table;
width:100%;
background:url('landingpagepic.jpg');
background-position:center top;
height:350px;
}我想要做的是使背景图像变暗。因为我在这个DIV中有UI元素，所以我不认为我真的可以在它上面放置另一个div来使它变暗。有什么建议吗？
回答 1
Stack Overflow用户
回答已采纳
发布于 2014-10-29 09:52:32
您可以将CSS3 Linear Gradient属性与背景图像一起使用，如下所示：
#landing-wrapper {
display:table;
width:100%;
background: linear-gradient( rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5) ), url('landingpagepic.jpg');
background-position:center top;
height:350px;
}下面是一个演示：
#landing-wrapper {
display: table;
width: 100%;
background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url('http://placehold.it/350x150');
background-position: center top;
height: 350px;
color: white;
}<div id="landing-wrapper">Lorem ipsum dolor ismet.</div>
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/26621513
复制相关文章
相似问题