css - 在不降低内容不透明度的情况下降低 div 的不透明度

Question

想在不降低内容不透明度的情况下降低页面内容容器背景的不透明度。

<div id="container">
   <div id="page contents">
   page contents goes here, like amazing articles and all that.
   </div>
</div>

需要能够随内容展开，因此不能有固定的高度。

绝对定位在内容下方意味着两个div之间没有任何关系，不会随着内容展开，所以我认为这是死路一条，否则请随意说。

不能使用 Jquery，因为它太慢而且不即时。请首选其他选项。

可能必须使用“png”背景图像，但我们希望不要这样做，因为它是一个模板，需要能够根据配色方案更改颜色。

可以按需生成图像，但不理想。

哦，最重要的是不能使用 CSS3，因为在 IE 中不起作用!当然!

有什么建议吗？

Answer 1

我的第一个冲动是透明的 PNG。

但进一步观察，尤其是考虑到您对可变配色方案的评论，也许加入 RGBA 支持对您有用。这里有一篇很好的帖子(包括如何绕过 IE——它根本不支持它):

http://css-tricks.com/rgba-browser-support/