不透明度設置的背景是堅實的，並且在Chrome和Opera中不透明

我有一個帶有文本和背景的div，它向下滾動後會越過主滑塊。我想要一些透明度。 Firefox中的所有內容都可以使用，其中該圖層透明並帶有一些不透明度設置。但在鉻和歌劇它是堅實的，滑塊下不可見。我用：不透明度設置的背景是堅實的，並且在Chrome和Opera中不透明

background:rgba(255,255,255,0.5);

我事件試圖使用透明的PNG，但它也是堅實的。 Problem preview

如何在Chrome和Opera中使背景透明？

2016-07-04 kasper

將上面的代碼更改爲background-color：rgba（255,255,255,0.5）;並看看它是否有效。 –

您的問題必須是一些有衝突的CSS，請參閱https://jsfiddle.net/o17pkhgo/ - 背景屬性確實有效。您的網站太複雜，我不能說出什麼問題，特別是使用滑塊動畫時，很難檢查更改。 –

問題溢出：隱藏; – kasper

對於這樣的問題，您可以做兩件事之一。

方法1

body,html { /*OR whatever selector you had*/ 
    background-color:rgba(255,255,255,0.5); /*Note that the property is background COLOR*/ 
}

方法2

看到這個link

2016-07-04 16:05:45

方法1不工作，方法二在我的情況下是不可能的 – kasper

我知道這是一個老問題，但搜索同樣的問題，這POP操作起來在上面給我。所以我有同樣的問題 - 在Firefox中完美工作，但在Chrome上完全沒有任何不透明。我做了什麼，它的工作完美（至少現在）它從RGBA顏色改變爲HSLA顏色。在我的情況下改變了以下內容：

background-color: rgba(0, 0, 0, 0.75);

到

background-color: hsla(0, 0%, 0%, 0.75);

我不知道爲什麼鉻喜歡的顏色HSL和透明度。另一個值得考慮的問題是，新版瀏覽器支持HSL顏色。

2017-06-15 15:54:28 DvD

回答