html - div 内的 div 包括背景图片

Question

我有两个 div。第一个是“parent”，它为另一个 div 提供宽度和高度。第二个 div 有 background-attachment: fixed 并且有一个问题...当宽度:100% 和高度:100% 时，我的图像不会显示。当图像的高度为:800px 时，一切都很好，但是当我更改屏幕分辨率时，第一个 div 不会随图像缩放，因此图像和其余内容之间有一个空白区域。任何想法如何解决它？感谢您的回复!

<div class="divimgparent">
<div class="divimg"></div>
</div>
.divimgparent {width: 100%; height: auto;}
.divimg {background: url("../images/1.jpg"); width: 100%; height: 800px; background-repeat: no-repeat; background-size: contain; background-attachment: fixed;}

Answer 1

试试这个。在这里，当您的 css 为 height: auto; 时，您的父 div 未获得高度。因此，您需要为父级 div 定义一个高度。

html, body {
  width: 100%;
  height: 100%;
}
.divimgparent {
    width: 100%;
    height: 100%;
}
.divimg {background: url("http://www.ecdevelopment.org/wp-content/uploads/2015/04/hippie-flower.jpg");width: 100%; height: 100%; background-repeat: no-repeat; background-size: contain; background-attachment: fixed;}

<div class="divimgparent">
<div class="divimg"></div>
</div>