CSS背景色在透明圖像上

Question

我不知道如何將播放器圖像上的背景顏色設置為藍色。

我試過了：

CSS： background-color: transparent blue

這是頁面的鏈接：

主頁

有人可以指導我嗎？ 我需要使用photoshop並將其設置為藍色嗎？

更新：

我指的只是帶有播放器圖標的圖像。

Answer 1

將此添加到您的CSS：

.fancy_video img {
    background-color: #33d;
    -webkit-border-radius: 50%;
       -moz-border-radius: 50%;
            border-radius: 50%;
}

僅對於IE9 +，如@showdev所建議的那樣具有透明背景：

.fancy_video img {
    background-color: rgba(51,51,221,.5);
    -webkit-border-radius: 50%;
       -moz-border-radius: 50%;
            border-radius: 50%;
}

Answer 2

您不能同時具有背景圖片和背景顏色的html元素（在CSS中）。 因此，完成目標操作的最簡單方法是使用CSS中的不透明度或RGBA，使元素直接位於圖像上方，並在其上具有藍色。

例如：

[http://jsfiddle.net/wyj3oj93/]