2

我有ul一个background-colorrgba(15,15,15,0.8)我希望li列表的元素更加透明,例如我希望它background-color设置为rgba(15,15,15,0.5). 问题是内部li元素是透明的,我看到它父母的背景颜色ul所以我得到的实际上是一个更暗的背景

CSS中有没有办法(但就此而言,通过JS / jQuery也可以)“取消”父级的背景属性?

编辑

li请注意,即使我不认为这很容易也不是一个好的解决方案,也可以为列表的“其余部分”(不是由 s 制作的列表部分)着色。

4

3 回答 3

1

您可以通过不在 上设置背景ul并在li.

演示

相关CSS:

border: solid .5em rgba(15,15,15,.8);
background: rgba(15,15,15,.5);

(您可以调整边框的宽度值以满足您的需要)

于 2013-04-10T23:24:58.130 回答
0

如果您只是想使颜色变亮(而不是让底层图像或文本显示出来),您可能会考虑使用background-color: rgba(256,256,256,0.3)它会在您的子元素上放置一层淡淡的白色雾霾。

在这里查看:http: //jsfiddle.net/9VBnr/

您还可以查看 Eric Meyer 的这个老歌但很好:http: //meyerweb.com/eric/css/edge/complexspiral/demo.html

于 2013-04-10T19:22:20.207 回答
0

抱歉,但这就像通过将一块有阴影的玻璃放在另一块有阴影的玻璃上来期待更清晰的视野一样。它只是行不通。:)

你需要做的是扭转你的想法。使最顶层具有正确的外观,然后移动到它下面的一层。

使用非透明背景设置 li 元素的样式。如果您需要纯色以外的其他东西,请使用精灵来获得您想要的外观。然后移动到 ul 元素并给出你想要的外观 - 甚至使用不透明度。

于 2013-04-10T20:22:06.927 回答