如何为引导下拉菜单设置不同的不透明度

【问题标题】：How to set different opacity to bootstrap dropdown menu如何为引导下拉菜单设置不同的不透明度
【发布时间】：2018-04-03 12:25:29
【问题描述】：

我正在使用

.navbar-default {
z-index:99;
opacity:0.8;
}

我想将下拉菜单项设置为 0.9 不透明度。

尝试了很多东西，但都没有成功。例如：

.dropdown-menu>li>a {
opacity:0.9 !important;
}

.navbar-default .navbar-nav .open .dropdown-menu>li>a {
opacity:0.9 !important;
}

.open {
background: #fff !important;
opacity:0.9 !important;
}

为了更清楚，菜单中的所有内容都获得 0.8 的不透明度，打开的下拉菜单除外。所以我需要一种方法来覆盖第一条规则（设置 0.8 不透明度的规则）

【问题讨论】：

标签： css twitter-bootstrap menu transparency opacity

【解决方案1】：

改用rgba，如果不起作用，请发表评论

.dropdown .dropdown-menu {
background-color:rgba(255,0,0,0.5);
}

查看demo here

【讨论】：

似乎使用 rgba 值不会覆盖父类中设置的不透明度。
对我来说它似乎工作（firefox）。下拉菜单是透明的。
是的，但你是否也设置了 .navbar-default {opacity:0.8} 因为如果设置了，例如我希望在带有 rgba 的下拉菜单中不透明度为 1，它将显示 0.8 不透明度和不是 1. 在 Firefox 和 Chrome 中测试。
能否请您 fork 演示并将内容更新为您希望能够理解并准确执行您需要的内容。请不要忘记发送网址
好吧，这里是codepen.io/Snippet/pen/PJvaMP 你可能会注意到css的第二行没有生效，这就是问题所在。如何在不删除父不透明度行的情况下覆盖/设置子元素的不同不透明度。