透明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}