div中的背景不透明div

Question

让我们以此为例。 所以你可以在这里看到绿色div里面的红色div。 如何使绿色div的背景具有不透明度，但同时红色divs内容/背景保持完全可见性。

Answer 1

如果我理解您正确要求的内容，则可以使用rgba()值作为绿色div的背景颜色：

＆＃13;

＆＃13;

.green {
  height: 400px;
  background: rgba(83,210,103,0.5);
  }
.red {
  height: 200px;
  background-color: red;
  width: 80%;
  margin: 0 auto;
  }

＆＃13;

<div class="green">
  GREEN
  <div class="red">
    RED
  </div>
</div>

＆＃13;

＆＃13;

＆＃13;

rgba()取红色，绿色，蓝色（rgb）的三个正常值以及 alpha 值，1默认为不透明，0.5半透明，等