悬停图像时更改背景颜色

Question

图像悬停时我需要更改颜色。

我的div中带有img，因此当我将图像悬停时，我将不透明度更改为0.3，但颜色为白色，我想将其更改为绿色， 有可能吗？

<div class="col-md-4 col-sm-6" style="padding: 0px !important;width:50px;height: 350px">  
              <img class="img-fluid " id="myImg" src="img1.png" alt="" style="width:100%;height: 100%">
          </div>
#myImg{
  cursor: pointer;
  transition: 0.3s;
}
#myImg:hover,{
  opacity: 0.3;}

this is what I need to have

this what I am able to do

Answer 1

您看到的白色来自背景的白色。相反，您可能要在此处执行的操作是更改div的不透明度和颜色，而不是像这样更改img的颜色：

CSS

after()

HTML

.demo{
  background-color: green;
}

#myImg:hover{
  opacity: 0.3;
}