透明div內的非透明div

Question

我正在創建一個透明div的網頁。

我想在透明div內添加一個不透明的div，我發現它也是透明的。

我嘗試將div設置爲不透明：1但它不起作用。

我該怎麼辦？

Answer 1

有兩種方法，我知道的，以解決此問題：

• 上包含div僞透明使用透明PNG作爲背景圖像。
• 將div分開以便它們並排排列，然後使用相對或絕對定位來堆疊它們。

Answer 2

這在CSS中不起作用。在過去，我使用了定位將包含內容的非透明div推入透明div。我無法從我的項目發掘一些舊的代碼，但我沒有找到這個博客帖子：

Non-transparent elements inside transparent elements

Answer 3

我發現這個地方，而研究CSS3和道歉，我不能再調用，其中以信貸合適的作者。

但是，如果您正在尋找div上的半透明背景純色。使用rgba（rrr，ggg，bbb，aaa）格式直接設置background-color屬性，而不是使用opacity/alpha屬性設置顏色和控制透明度。這將防止任何子元素繼承任何透明度。

ex。

#mydiv { background-color: rgba(128,64,0,0.75); } 

Answer 4

使用背景，填充，background-origin來控制填充和z-index來控制元素的位置。例如：

#mydiv{ background: white; padding:100px; background-origin:border-box; z-index:1}