html - 应用于 :before element of css did not get applied to the entire div 的背景

Question

<分区>

Answer 1

您需要将position: relative 添加到#pages div。所以 :after 伪元素相对于它是绝对定位的。

#pages {
  display: flex;
  align-items: center;
  justify-content: center;
  background: url(../img/background.png);
  background-size: 100% 100%;
  padding: 80px 0 0 0;
  min-height: 100vh;
  position: relative;
}

#pages:after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background: rgba(0, 0, 0, .5);
  height: 100%;
}

<section id="pages">
 <div class="container">
  ...
  ...
  ....
 </div>
</section>