html - Css 不透明度属性

<分区>

我有一个问题。这是示例:

nav {
  width: 100%;
  background: #000;
  opacity: 0.8;
}

ul {
  background: green;
  opacity: 1;
}

<nav>
  <ul>
    <li>Link1</li>
    <li>Link2</li>
  </ul>
</nav>
<header>
  <h1>123</h1>
</header>

问题是，ul 也有opacity。所有这一切我的意思是 nav 标签没问题，它的不透明度为 0.8，但我的 ul 标签不应该有不透明度，如果你查看 css 则不会在浏览器中，但我仍然可以在 ul 和 li 标签后面看到 h1 文本。

最佳答案

nav {
  width: 100%;
  //background: #000;
  //opacity: 0.8;
  background-color: rgba(0, 0, 0, 0.8);
}

ul {
  background: green;
  //opacity: 1;
}

<nav>
  <ul>
    <li>Link1</li>
    <li>Link2</li>
  </ul>
</nav>
<header>
  <h1>123</h1>
</header>

使用 rgba() 怎么样？

关于html - Css 不透明度属性，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/46659330/

相关文章：

html - 从两侧 html css 围绕图像/形状包装两列文本