如何在图像上获得渐变？ （链接）

Question

一切都应该在这个jsfiddle中解释。

我很抱歉，但我无法获得显示的链接。它在评论中！

我无法让它在图像上给我一个红色渐变..

Answer 1

你需要一个围绕图像的包装器，但这里有一个如何设置它的例子：

.imgWrap {position:relative; display:inline-block;}
.imgWrap img {display:block;}
.imgWrap:after {content:""; position:absolute; top:0; left:0; bottom:0; right:0; background:linear-gradient(transparent, red);}
.imgWrap:hover:after {display:none;}

<div class="imgWrap">
	<img src="https://rocket-league.com//content/media/items/avatar/220px/75e8bb7e5d1473412157.png" />
</div>