Html 引导-全屏标题图像后跟背景图像

新的在引导。我在设置背景图像以跟随标题图像时遇到问题

标题部分有自己的全屏背景，然后我希望后面是平铺背景图像

我试过：

<div class="header">...</div>

<div class="main-body">
    <div class="container">...</div>
    <div class="container">...</div>
    ...
</div>

<div class="footer">...</div>

问题是主体背景的顶部被标题主体的底部隐藏

我做错了什么？

请验证这一点或

我有一个解决方案给你

问题1） 我所做的是在第一个div下面添加了一个

（因此，这个div带有类简介）。img的类别为

bg

然后添加以下css：

.bg{
  position:absolute;
  z-index:-1;
  width:100%;
  height:100%;
}

这是你的小提琴。我添加了很多

标记，向您展示它的工作原理

您还可以尝试设置背景图像

高度：100%

和

宽度：自动。如果这样做，图像就不会在某些屏幕上如此拥挤

问题2）
我给每张幻灯片都发了一张课堂幻灯片。我还向所有幻灯片类添加了
position:relative。塔卡：看这把小提琴

我希望你的问题现在得到解答。如果您还有其他问题，请随时询问。
如果不知道图像的尺寸，可能很难诊断问题。你能通过编辑你的问题并使用包含图像的代码段功能（快捷键：Ctrl+M）来设置一个交互式示例吗？请看css定位
.bg{
  position:absolute;
  z-index:-1;
  width:100%;
  height:100%;
}