存在图像时的CSS背景颜色

时间:2015-05-02 21:07:11

标签: css colors background

我希望在背景图像后面隐藏一种颜色,这样当用户访问我的网站时无法查看图像或选择不查看图像就可以得到一个相当一致的网站。我尝试在图像之前和之后添加颜色,但颜色超出了我的图像。我甚至尝试在图像后使用一种颜色,但是颜色会在整个场景背景下着色。

.headerWrapper {
    background: url(../images/headerBG.png) repeat-x;
    width:100%;
    float:left;
}
.header {
    height:94px;
    width:1000px;
    float:left;
}

1 个答案:

答案 0 :(得分:1)

您的问题不清楚您尝试过的代码。但是您应该使用background-imagebackground-color CSS属性,因为声明background两次会覆盖其他任何

Demo

.headerWrapper {
    background-image: url(../images/headerBG.png);
    background-repeat: repeat-x;
    background-color: rgb(50,150,250);
    width:100%;
    float:left;
}

或在背景线中包含颜色

Demo

.headerWrapper {
    background: url(../images/headerBG.png) rgb(50,150,250) repeat-x;
    width:100%;
    float:left;
}