Css 如何设置跨距背景的不透明度，而不是文本？

我有一些代码需要定制

我的html

<div class="text-rotator add-top-half add-bottom-half align-left white-txt medium-txt uppercase highlight-bg">
    <div class="rotator-wrap" style="display: block;">
        <span class="rotate">Creating designs!</span>
    </div>
</div>

但目前它正在设置文本和背景的不透明度，我无法确定如何离开文本而只改变背景

有什么想法吗？

使用以下CSS：

.text-rotator span {
 background-color:rgba(255,0,0,0.3);/*background color and opacity together*/
 }

为背景使用颜色值：

。文本旋转器{
线高：80px！重要；
显示：内联！重要；
}
.文本旋转器跨距{
背景：rgba（51153255,0.6）！重要；
}

创造设计！

常见问题。不透明度将应用于所有子元素。解决方法是使用rgb颜色代码。并非所有浏览器都支持rgba，因此您也应该定义回退

/* Fallback for web browsers that don't support RGBa */
background-color: rgb(0, 0, 0);
/* RGBa with 0.6 opacity */
background-color: rgba(0, 0, 0, 0.6);
/* For IE 5.5 - 7*/
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000);
/* For IE 8*/
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000,endColorstr=#99000000)";

使用以下命令：

---

.text rotator span.rotate{background:rgba（0,0,0,0.5）；}

太好了，谢谢！！我会尽快接受你的回答：）@totalytechit（不客气）StackOverflow上已经有一些问题，可以在google上快速搜索，甚至在这里搜索，你会找到它们的。

/* Fallback for web browsers that don't support RGBa */
background-color: rgb(0, 0, 0);
/* RGBa with 0.6 opacity */
background-color: rgba(0, 0, 0, 0.6);
/* For IE 5.5 - 7*/
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000);
/* For IE 8*/
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000,endColorstr=#99000000)";