html - 在 :before of div need to apply height of image?

Question

我创建了一个div，我需要设置div的背景图片。为此，我编写了以下 CSS:

div#review:before {
    background: url(review-background.png);
    background-repeat: no-repeat;
    position: absolute;
    width: 100%;
    height: 1400px;
    top: -25%;
}

但是，这里我的内容是动态的。所以，我无法在 CSS 中设置高度。那么，有人可以在不使用高度的情况下帮助我吗？

提前致谢。

Answer 1

试试这个代码

删除 position: absolute;height: 1400px;top: -25%; 并添加 background-size: cover; 同时删除 psuedo元素 :before 不需要

div#review {
  background: url("https://www.w3schools.com/w3images/fjords.jpg");
  background-repeat: no-repeat;
  width: 100%;
  background-size: cover;
  color:yellow;
}

div {
  margin-bottom: 10px;
}

<div id="review">asdsadsad</div><br>
<div id="review">asdsadsad asasd sdfsdf sdfsdf sdfsdfdf
</div>

<div id="review">
  <pre>asdsadsad asasd
sdfsdf
sdfsdf
sdfsdfdf</pre>
</div>