css - 悬停时深色背景不透明度

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

将您的 img 放在 bg 颜色为深色和不透明度为 0.5 的 div 中 并为 div 提供比 img 更大的 z-index 值。

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