Question

图像后面的背景而不会使图像变暗。目前，我有一个像这样的html元素

<div className='new-offers-item-favourite' />

该元素具有线性渐变并为其设置了图像：

background: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3) ), url('http://res.cloudinary.com/wisdomabioye/image/upload/v1462961781/about_vbxvdi.jpg') no-repeat center center;

这也会影响实际图像，当我需要它0.3不透明时会变成白色。

有没有一种方法可以不将图像包装到<div>上呢？也许是:after伪元素。希望有一个CSS方法。

更新1。 也尝试过这个。效果一样。

background-image: url('/assets/images/new-offers-tem-favourite.3c611ec2.svg');
background-color: #000;
opacity: 0.5;

Answer 1

解决方案。

background-image: url('/assets/images/new-offers-item-favourite.3c611ec2.svg');
background-color: rgba(0, 0, 0, 0.5);

功劳归@misorude。

使CSS图像背景变暗

1 个答案: