当我调整窗口大小时，绝对定位的 div 并不总是固定为底部零答案

【问题标题】：absolute positioned div is not always fixed with bottom zero when i resize the window当我调整窗口大小时，绝对定位的 div 并不总是固定为底部零
【发布时间】：2020-07-28 12:19:31
【问题描述】：

我有一个绝对定位在另一个 div 中的 div。绝对定位的 div 有一个背景图像，它的底部是 0。但是当我调整窗口大小时，它会出现在容器 div 的中间。它并不总是固定在底部 0。我该如何解决？

<div class="img-container">
  <div class="wave"></div>
</div>

.img-container {
background: url("/images/laptop.jpg");
background-size: cover;
height: 100vh;
position: relative;
}
.wave {
 position: absolute;
 bottom: 0;
 background: url("/images/wave.png");
 background-size: 100%;
 background-repeat: no-repeat;
 height: 143px;
 width: 100%;
}

【问题讨论】：

标签： css css-position

【解决方案1】：

内部 div .wave 坚持使用 bottom: 0。（红色边框元素是带边框的内部 div，仅用于演示）

创建此间隙是为了保持图像的纵横比。如果您可以拉伸内部 div 背景，请设置 background-size: 100% 100%;（用于内部 div）。它会拉伸图像，但不会创建看起来像 .wave 不坚持 bottom: 0; 的空白空间

【讨论】：