我可以将opacity属性分配给div的background属性而不是它上面的文本吗？
我试过了：
background: #CCC;
opacity: 0.6;但这不会改变不透明度。
听起来你想使用透明背景，在这种情况下你可以尝试使用rgba()函数：
rgba(R, G, B, A)R（红色），G（绿色）和 B（蓝色）可以是
<integer>s 或<percentage>s，其中数字 255 对应于 100％。 A（α）可以是 0 到 1 之间的<number>，或<percentage>，其中数字 1 对应于 100％（完全不透明度）。RGBa 的例子
rgba(51, 170, 51, .1) /* 10% opaque green */ rgba(51, 170, 51, .4) /* 40% opaque green */ rgba(51, 170, 51, .7) /* 70% opaque green */ rgba(51, 170, 51, 1) /* full opaque green */
一个小例子，展示了如何使用rgba 。
截至 2018 年，几乎每个浏览器都支持rgba语法 。
最简单的方法是使用 2 个 div，1 个带背景，1 个带文本：
#container {
position: relative;
width: 300px;
height: 200px;
}
#block {
background: #CCC;
filter: alpha(opacity=60);
/* IE */
-moz-opacity: 0.6;
/* Mozilla */
opacity: 0.6;
/* CSS3 */
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
}
#text {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}<div id="container">
<div id="block"></div>
<div id="text">Test</div>
</div>仅限少用户：
如果你不喜欢使用 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%);
}