悬停时的深色背景不透明度

Question

我有这个 CSS。当您将鼠标悬停时，图像背景变为白色不透明度，但我希望它变为深色不透明度。我尝试添加深色背景颜色，但没有。

.img-container .img-item a.image:hover img {
   opacity: .2;
   filter: alpha(opacity=50);
   background-color: rgba(0, 0, 0, 0.5);
   transition: all 1s;
   -webkit-transition: all 1s;
    }

Answer 1

您不能为图像添加背景，而是可以在父元素处添加background-color。

Answer 2

将你的 img 放在一个 bg 颜色深且不透明度为 0.5 的 div 中 并为 div 赋予比 img 更大的 z-index 值。

#imgcontainer
{
opacity:0.5;
background-color: Black;
z-index:10;
}
#imgcontainer img
{
      Z-index: 5;
}