Html 悬停时的IMG链接覆盖

我想知道如何设置绿色覆盖的img与链接

<section>
  <div class='container>
    <div class='row'>
      <a href ='https://stackoverflow.com/' target="_blank">
        <img src="i cant cause i need at least 10 rep to post images">
      </a>
    </div>
  </div>
</section>

您可以使用纯css来实现这一点。这将使您的图像背景绿色悬停

img{
    width:50px;
    height:50px;
    background-image: url("URL TO IMAGE");
}

img:hover{
   background-color: green;
   background-blend-mode: multiply;
}

什么是“绿色覆盖”？我希望在img上悬停时使用绿色覆盖，而不是不透明，而是整个img上的绿色。你至少要尝试解释一下这意味着什么，而不要重复“绿色覆盖”。像这里但没有任何span/div？顺便说一句，这个解决方案对我不起作用；oLike？不，我需要我的图像在绿色和不透明的情况下我更新了我的答案以符合要求。只需根据需要更改颜色。哦，谢谢，有背景就可以了，但我想知道在没有背景图像等的情况下如何操作。我将其更改为使用CSS混合模式，而不是插入框阴影。为此，您需要使用JavaScript。