如何用与图像相同大小的另一种透明颜色覆盖图像

Question

我希望用另一种透明色或其他图像覆盖图像，以便我能够从覆盖的颜色中清晰地查看图像内容

Answer 1

检查以下示例：

div {
    background: url( ..) no-repeat;
    width: 100px;
    height: 100px;
    position: relative;
}

div:after {
    content: "";
    background: rgba(255,255,255,.4);
    position: absolute;
    width: 100px;
    height: 100px;
}

如果要覆盖具有透明覆盖图像或图像的图像，可以使用伪元素

来实现此目的

http://jsfiddle.net/wef8M/

但是如果你想在叠加层中有一些内容，你必须创建一个包装来包装背景img。