我将 youtube iframe 放置在不透明度为 0.8 的内容框中
opacity: .8;
filter: alpha(opacity=80);
但是视频也显示为透明的，因为您可以通过它们看到网站的背景。我已经尝试过以各种可能的方式更改 wmode ，但这没有任何区别。Firefox 不会发生这种情况，但 Chrome 会发生这种情况。
问问题
142 次
3 回答
3
当你opacity在一个元素上使用 CSS 属性时，它的所有子元素都会继承它，你不需要做任何改变......
...除了您可以使用透明 png 背景图像，或使用rgba()或hsla()颜色值。
如此透明的黑色 rgba 将是background: rgba(0, 0, 0, .5);和 hslabackground-color: hsla(0, 0%, 0%, .5);
这些属性不是继承的，因此不会影响孩子，无论它们是什么:)
在这里你可以看到三个不同的 CSS 规则（不是透明 png）在使用中。注意最后两个的子元素不受影响:)
于 2012-12-01T14:58:43.693 回答
2
实际上，这opacity就是应该的工作方式，它设置元素及其所有内容的不透明度，而不仅仅是背景。如果你只想要一个半透明的背景，你应该使用透明 png 之类的东西作为background-image.
于 2012-12-01T14:50:00.237 回答
1
我建议使用半透明的 .png 作为背景而不是不透明度。也可以使用 rgba 作为背景色，但在 IE 中没有实现。IE 8 及以下版本不支持 Rgba（对于 IE 9 不确定），因此可以使用过滤器来实现所需的效果。但它有时会以某种方式使字体看起来很糟糕（删除抗锯齿或类似的东西）。
另一方面，1*1px 的 png 非常小，可以内置到您的 css 文件中。
于 2012-12-01T15:19:53.070 回答