如何設置圖像透明度顏色？

在爲我的透明度添加不同顏色時遇到一些問題。之前它是在圖像頂部的黑色填充，所以當我將圖像懸停在圖像上時，陰影會亮起。但是，當我嘗試添加紅色rgba顏色時，透明度仍保持相同的顏色。如何設置圖像透明度顏色？

img { 
    opacity:0.4; 
    filter:alpha(opacity=40); /* For IE8 and earlier */ 
    color: rgba(255, 0, 0, 0.2); 
    } 

    img:hover { 
    opacity:1.0; 
    filter:alpha(opacity=100); /* For IE8 and earlier */ 
    color: rgba(255, 0, 0, 0.2); 
    }

來源

2013-10-03 Brian Lam

您需要將color屬性更改爲background-color。

CSS

img { 
opacity:0.4; 
filter:alpha(opacity=40); /* For IE8 and earlier */ 
background-color: rgba(255, 0, 0, 0.2); 
} 

img:hover { 
opacity:1.0; 
filter:alpha(opacity=100); /* For IE8 and earlier */ 
background-color: rgba(255, 0, 0, 0.2) !important; 
}

JSFIDDLE

來源

2013-10-03 18:24:01 fiskolin

試了一下，可惜陰影仍是黑色的。 –

也許你正在使用黑色陰影的圖像...... :)或者你可能在你的_CSS_中使用了「box-shadow」。請提供您的圖片。 – fiskolin

除非它沒有出現在Firefox上。 –

如何設置圖像透明度顏色？

回答

相關問題