CSS3背景图像不'；垂直拉伸

我有一个问题，垂直拉伸的背景图像一直到底部。我知道我可以在容器类

上设置
高度
或
最小高度
。查看索引

，但不想手动设置高度属性，因为我希望在用户调整浏览器大小时图像响应浏览器大小

虽然背景图像向下延伸，但我不希望它覆盖第二幅图像，

。查看额外img

我希望实现的目标示例：

这是我的（更新版）

类似的东西吗

。查看索引{
背景：url（“https://mdbootstrap.com/img/Photos/Others/img （42）.jpg“）无重复中心；
背景尺寸：封面；
宽度：100%；
身高：100%；
位置：绝对位置；
溢出：隐藏；
排名：0；
左：0；
}
.查看文本{
颜色：白色；
保证金：自动；
文本对齐：居中；
}

这个导航栏不是固定的
当你向下滚动时，它将消失


带背景图像的完整页面介绍将始终以全屏模式显示，无论设备如何

像这样的东西

。查看索引{
背景：url（“https://mdbootstrap.com/img/Photos/Others/img （42）.jpg“）无重复中心；
背景尺寸：封面；
宽度：100%；
身高：100%；
位置：绝对位置；
溢出：隐藏；
排名：0；
左：0；
}
.查看文本{
颜色：白色；
保证金：自动；
文本对齐：居中；
}

这个导航栏不是固定的
当你向下滚动时，它将消失


带背景图像的完整页面介绍将始终以全屏模式显示，无论设备如何

将高度设置为100vh将满足您的需要

。查看索引{
背景：url（“http://i.imgur.com/f6f5Xq7.jpg）无重复中心；
背景尺寸：封面；
显示：-webkit flex；
显示器：flex；
高度：100vh；
}
.查看文本{
颜色：白色；
保证金：自动；
文本对齐：居中；
}

这个导航栏不是固定的
当你向下滚动时，它将消失


带背景图像的完整页面介绍将始终与设备无关

将高度设置为100vh将满足您的需要

。查看索引{
背景：url（“http://i.imgur.com/f6f5Xq7.jpg）无重复中心；
背景尺寸：封面；
显示：-webkit flex；
显示器：flex；
高度：100vh；
}
.查看文本{
颜色：白色；
保证金：自动；
文本对齐：居中；
}

这个导航栏不是固定的
当你向下滚动时，它将消失


带背景图像的完整页面介绍将始终与设备无关

是的，这解决了问题，但实际上我在

查看索引

之外还有另一个div（请参阅更新的OP），因此我无法在

查看索引

上设置

位置：绝对

，因为它将重叠第二张图像

查看额外img

。现在，我将投票支持你的文章，因为你提供了一个解决方案，我以前写的OP无论如何。谢谢。是的，这解决了问题，但实际上我在

查看索引

（请参阅更新的OP）之外还有一个div，因此我无法在

查看索引

上设置

位置：绝对

，因为它将与第二张图像重叠

查看额外img

。现在，我将投票支持你的文章，因为你提供了一个解决方案，我以前写的OP无论如何。谢谢。哇，为了这么简单的解决方案，我费了好大劲。很好，很简单，谢谢。哇，为了这么简单的解决方案，我费了好大劲。很简单，谢谢。