应该是一个相当简单的问题。在我的网站中我这样做：
#landing-wrapper {
display:table;
width:100%;
background:url('landingpagepic.jpg');
background-position:center top;
height:350px;
}
我想做的就是使背景图像变暗。因为我在这个 DIV 中有 UI 元素，所以我不认为我真的可以在它上面放置另一个 div 来使其变暗。建议？
您可以使用CSS3 线性渐变 http://www.w3schools.com/css/css3_gradients.asp属性以及您的背景图像，如下所示：
#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>
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
