在现有背景图象的梯度背景图象

Question

是否可以在现有背景上制作图像渐变的一部分？

Answer 1

您添加的示例图片中的结果可以通过使用2个容器来实现，一个带有背景图像，另一个（位于第一个顶部）使用CSS渐变背景，其中一个渐变颜色具有alpha为0（即透明）。

有关CSS渐变的更多信息，请参阅：https://developer.mozilla.org/nl/docs/Web/CSS/CSS_Images/Using_CSS_gradients

制作一侧透明的渐变，使用rgba颜色，例如：

#grad1 {
    height: 200px; width:500px;
    background: linear-gradient(to right, rgba(255,0,0,1), rgba(255,0,0,0)); 
}

rgba中的a代表alpha，透明度的值介于1（不透明）和0（透明）之间