我可以将不透明度属性分配给一个div的背景属性，而不是它的文本吗?
我试过了:
background: #CCC;
opacity: 0.6;
但这不会改变不透明度。
当前回答
对于任何遇到这个线程的人，这里有一个名为thatsNotYoChild.js的脚本，我刚刚写的，它自动解决了这个问题:
http://www.impressivewebs.com/fixing-parent-child-opacity/
基本上，它将子元素与父元素分离，但将元素保持在页面上相同的物理位置。
其他回答
这样做的一个好方法是使用CSS 3。
创建一个div宽度类-例如，在你的页面顶部的supersizer:
然后设置以下CSS属性:
.supersizer { 后台:url("http://fc06.deviantart.net/fs70/f/2012/099/d/f/stackoverflow_16x16_icon_by_muntoo_stock-d4vl2v4.png")无重复中心中心固定; 宽度:100%; 高度:100%; 位置:固定; z - index: 1; 透明度:0.5; -webkit-background-size:封面; -moz-background-size:封面; -o-background-size:封面; background-size:封面; 上图:0; ｝ < div class = "超大" > < / div >
我的技巧是创建一个透明的。png颜色和使用background:url()。
仅适用于Less用户:
如果你不喜欢使用RGBA设置颜色，而是使用HEX，有解决方案。
你可以像这样使用mixin:
.transparentBackgroundColorMixin(@alpha,@color) {
background-color: rgba(red(@color), green(@color), blue(@color), @alpha);
}
像这样使用它:
.myClass {
.transparentBackgroundColorMixin(0.6,#FFFFFF);
}
实际上，这是内置的Less函数也提供的:
.myClass {
background-color: fade(#FFFFFF, 50%);
}
看我如何转换十六进制的颜色与rgba与少编译器?
我也有同样的问题。我想要100%透明的背景色。只需使用这段代码;这对我来说非常有效:
rgba(54, 25, 25, .00004);
你可以在这个网页的左边(联系表单区域)看到一些例子。
对于任何遇到这个线程的人，这里有一个名为thatsNotYoChild.js的脚本，我刚刚写的，它自动解决了这个问题:
http://www.impressivewebs.com/fixing-parent-child-opacity/
基本上，它将子元素与父元素分离，但将元素保持在页面上相同的物理位置。
