如何更改另一个元素的不透明度率

我有一个按钮，可以用:hover更改不透明度，但里面有一个图像不应受按钮的不透明度更改影响。如何更改另一个元素的不透明度率

例如，这样的事情：

.expandIMG:hover{ 
    opacity: 0.6; 
} 

.expandIMG:hover,div,img{ 
    opacity: 1; // this make no opacity but for all the button an i just want  
       // the image that are inside of some div. 
}

来源

2015-02-10 Arturo Andrés Órdenes Barraza

如果我理解正确的话，一个子元素不能超过父更高的透明度。 – Devin 2015-02-10 01:13:31

@Devin，我认为你的权利，父母的不透明控制着所有的孩子 – 2015-02-10 01:15:35

-3

您也可以尝试设置图像更高的z-index的同时徘徊。也许this answer对你也很有用。

.expandIMG:hover img { 

    z-index: 9999; // more than the expandIMG 

}

来吧请给我更多的赞赏！喂我！！

来源

2015-02-10 01:05:20 warrenG

不知道为什么这是一个答案... – 2015-02-10 01:26:37

数字1：z-index不适用于静态定位元素！ – 2015-02-10 01:27:12

我想你想包含图像的div的不透明度改为0.6，同时保持图像的不透明度为1

你可以做到这一点使用background: rgba(0,0,0,1)，而不是不透明度：

.expandIMG { 
    background: rgba(0,0,0,1); 
} 

.expandIMG:hover{ 
    background: rgba(0,0,0,0.6); 
}

这样，您只需更改div背景的alpha（不透明度），而其内部的图像不受影响。

例子：http://jsfiddle.net/2krc5080/

来源

2015-02-10 01:17:24 user3781632

如何更改另一个元素的不透明度率

回答

相关问题