透明div里面的实心div？

Question

我有一个不透明度为.4的div内的导航列表（无序列表）。 UL内部的锚点设置为不透明度1，但这没有效果。

<div style="background-color: #000; opacity: 0.4">
    <ul>
        <li><a href=".." style="background-color: #000; opacity: 1">home</a></li>
    </ul>
</div>

有什么建议吗？ 感谢

Answer 1

尝试这样

<div style="background-color: rgba(0, 0, 0, .4);">
    <ul>
        <li><a href=".." style="background-color: rgba(0, 0, 0, 1);">home</a></li>
    </ul>
</div>

避免使用内联样式是一个好主意。

Answer 2

不透明度会被继承，因此当您应用不透明度时：1;对于子元素，它是根据不透明度计算的：0.4;这是它的父母。

要解决这个问题 - 如果你不能使用rgba - ，请创建一个包装元素，在其中创建0.4不透明度元素，然后创建另一个元素并绝对将一个元素放在另一个元素上。