CSS 悬停时的深色背景不透明度
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/27847518/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Dark background opacity on hover
提问by Omar
I have this CSS. When you hover the image background turns a white opacity, but I'd like it to turn a dark opacity. I tried adding a dark background color but nothing.
我有这个 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;
}
回答by Adam Cherti
Put your img in a div with bg color dark and opacity 0.5 And give z-index for the div a bigger value than for img.
将你的 img 放在一个 bg 颜色为深且不透明度为 0.5 的 div 中,并为 div 提供比 img 更大的 z-index 值。
#imgcontainer
{
opacity:0.5;
background-color: Black;
z-index:10;
}
#imgcontainer img
{
Z-index: 5;
}
回答by user3632930
you can't add background to an image, instead, you can add background-color
at parent element.
您不能为图像添加背景,相反,您可以background-color
在父元素中添加。