使用css更改不透明度的颜色

Question

我想改变不透明度的颜色。我有以下内容：

img{  
    background-color:red;
    opacity: 0.5;
    filter: alpha(opacity=50);
}

img:hover {
    opacity: 1;
    filter: alpha(opacity=100);
} 

所以不透明度的颜色是红色，但它是白色的。如何更改颜色，因为这不起作用！

Answer 1

使用rgba：

.imagini{
    background:rgba(255,0,0,0.5);
}

.imagini:hover{
    background:rgba(255,0,0,1);
}

Answer 2

使用不透明度和背景颜色时，它还取决于容器的背景。 当用50％降低不透明度时，这已经太多并且与身体或内容容器的背景颜色（即白色）具有对比度问题。另外，为什么不将悬停效果放在图像的包裹元素上。这样你就拥有了更多的造型自由。你可以将它与图像隔离开来。另外，我建议不要同时使用不透明度，并使用rgba（）作为首选方法。