我可以将不透明度属性分配给一个div的背景属性，而不是它的文本吗?
我试过了:
background: #CCC;
opacity: 0.6;
但这不会改变不透明度。
当前回答
Use:
background:url("location of image"); // Use an image with opacity
此方法适用于所有浏览器。
其他回答
你不能。你必须有一个单独的div作为背景，这样你只能对它应用不透明度。
我最近尝试这样做，因为我已经在使用jQuery，我发现以下是最不麻烦的:
创建两个不同的div。他们会是兄弟姐妹，彼此之间没有羁绊。 给文本div一个纯背景色，因为这将是无javascript的默认值。 使用jQuery获取文本div的高度，并将其应用到背景div。
我相信有一些CSS忍者的方法来做所有这些，只有浮动或其他东西，但我没有耐心去弄清楚。
听起来你想要使用一个透明的背景，在这种情况下，你可以尝试使用rgba()函数:
rgba(R, G, B, A) R (red), G (green), and B (blue) can be either <integer>s or <percentage>s, where the number 255 corresponds to 100%. A (alpha) can be a <number> between 0 and 1, or a <percentage>, where the number 1 corresponds to 100% (full opacity). RGBa example background: rgba(51, 170, 51, .1) /* 10% opaque green */ background: rgba(51, 170, 51, .4) /* 40% opaque green */ background: rgba(51, 170, 51, .7) /* 70% opaque green */ background: rgba(51, 170, 51, 1) /* full opaque green */
一个展示如何使用rgba的小示例。
截至2018年，几乎所有浏览器都支持rgba语法。
最简单的解决方案是创建3个div。一个将包含另外两个，一个有透明背景，一个有内容。使第一个div的位置相对，并设置一个透明背景为负z-index，然后调整内容的位置，以适应透明背景。这样你就不会有绝对定位的问题。
对于任何遇到这个线程的人，这里有一个名为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 >
