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

我有一個按鈕，可以用: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

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

回答

相關問題