背景图像上的半透明颜色层？

一尘不染

背景图像上的半透明颜色层？

css

我有一个DIV，我想放置一个图案作为背景。此图案是灰色的。为了使它更好一点，我想在上面放一个透明的颜色“层”。以下是我尝试过的方法，但是没有用。有没有办法将彩色图层放在背景图像上？

这是我的CSS：

background: url('../img/bg/diagonalnoise.png');
background-color: rgba(248, 247, 216, 0.7);

阅读 226

2020-05-16

共1个答案

一尘不染

这里是：

.background {
    background:url('../img/bg/diagonalnoise.png');
    position: relative;
}

.layer {
    background-color: rgba(248, 247, 216, 0.7);
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

对此的HTML：

<div class="background">
    <div class="layer">
    </div>
</div>

当然.background，如果其中没有其他元素，则需要为该类定义宽度和高度

2020-05-16