本文介绍了如何在CSS中用颜色覆盖图像?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我想在此标题元素上使用颜色叠加。我如何使用CSS?
I want a color overlay on this header element. How can I do this with CSS?
<header id="header">
<div class="row">
<div class="col-xs-12">
...
</div>
</div>
</header>
CSS
CSS
#header {
background: url(../img/bg.jpg) 0 0 no-repeat fixed;
height: 100%;
overflow: hidden;
color: #FFFFFF
}
推荐答案
你应该使用rgba来覆盖你的元素photos.rgba是一种在CSS中声明包含alpha透明度支持的颜色的方法。您可以使用 .row
作为覆盖层,如下所示:
You should use rgba for overlaying your element with photos.rgba is a way to declare a color in CSS that includes alpha transparency support. you can use .row
as an overlayer like this:
#header {
background: url(../img/bg.jpg) 0 0 no-repeat fixed;
height: 100%;
overflow: hidden;
color: #FFFFFF
}
.row{
background: rgba(39,62,84,0.82);
overflow: hidden;
height: 100%;
z-index: 2;
}
这篇关于如何在CSS中用颜色覆盖图像?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!