Question

我正在做一个弹出窗口。我已经完成了所有工作，但是当我想让它背后的任何东西的不透明度（我使用body标签）为0.6时，弹出窗口的不透明度也会改变。我怎么做到除了弹出窗口的不透明度之外的所有东西？ - 提前致谢：）

Answer 1

尝试使用rgba而不是opacity：

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

它是：红色，绿色，蓝色，alpha透明度值

Answer 2

好吧，我很好奇这个问题，并发现在Stack Overflow的某个地方，一个子元素永远不会比其父元素具有更高的不透明度，也不会覆盖它（不是＆＃34;官方＆＃34;来源，但我相信它）。

所以，我看到的最佳解决方法是将弹出窗口置于低不透明度元素之外。因为将弹出窗口放在<body>之外是没有意义的，所以我将所有内容包装在一个div中并将弹出窗口放在外面。例如：

我无法在JSFiddle中显示正文标记，但无论如何这里都是http://jsfiddle.net/qWRj5/1/

<body>
<div id="all">Lorem Ipsun Delores Sic Transit Glori Repium Sider Traministu 
Difirenziatum Tiramisu. Lorem Ipsun Delores Sic Transit Glori Repium Sider Traministu 
Difirenziatum Tiramisu. Lorem Ipsun Delores Sic Transit Glori Repium Sider Traministu 
Difirenziatum Tiramisu. 
</div>

<div id="popup">My Gosh, that is some awful Latin</div>
</body>

CSS

#all { opacity: 0.5 }
#popup { padding: 10px; border: 2px dotted blue; position: absolute; left: 20px; 
  top: 10px; background-color: #fce; }

身体不透明度影响整个页面？

2 个答案: