我正在开展一个项目，其中我使用图像作为菜单的背景。我已经在CSS样式表中定义了类，这些类指示项目是否被“选中”时的外观，这意味着用户不在每个项目链接的页面上。
我在图像顶部使用div构建了应用了样式的div，使其具有半透明的白色背景，因此看起来图像的一部分突出显示。每个半透明div还包含组成链接的文本，颜色设置为白色。我希望div保持不透明度，而文本保持不透明度为“1”。
我尝试过在类似问题（CSS - Apply Opacity to Element but NOT To Text Within The Element）中讨论过的方法，但该方法对我来说似乎不起作用。
如果您想查看它，我已在http://jsfiddle.net/Cwca22/uG5y8/在JSFiddle上发布了该链接的代码。
提前感谢所有帮助。
答案 0 :(得分：1)
如果我理解正确，您希望div的背景颜色部分透明以显示图像，但保持文字不透明？这很简单：3
<div style="background-color: rgba(255,255,255,0.5);">Text</div>
如果您想为不允许此格式的浏览器提供支持，则需要：
<div style="background: #ffffff; background: rgba(255,255,255,0.5);">Text</div>
答案 1 :(得分：1)
如果您正在寻找一个纯CSS解决方案，并且愿意稍微改变您的标记，请看一下这个例子：
它将每个“链接”视为单独的背景和文本元素的组合，然后将它们放在彼此之上，以便只有背景div使用透明度。
答案 2 :(得分：0)
没有任何标准解决方案的老问题！对于今天的CSS来说，这是众所周知的。我所知道的唯一解决方案是使用JS。使用JS，您可以捕获受影响的H＃的鼠标移动并创建/定位元素。这个新的'over'元素不应该是DIV的子元素，不透明度为0.2。
答案 3 :(得分：0)
有一次我为这样的问题写了一个jsFiddle。这是http://jsfiddle.net/A53Py/5/
创建一个相同级别的元素，该元素绝对位于元素后面而没有不透明度。无需告诉它跨浏览器。
希望有所帮助