为什么最小高度不适用于背景？

Question

我已经为 div class 添加了背景。我想要的是图像高度始终与浏览器 window 具有相同的高度，我试图通过 min-height= 100% 来实现。虽然我没有让它工作..有什么建议吗？

HTML:

<div id="top" class="jumbotron">
</div>

CSS:

.jumbotron {
    background: no-repeat center center url('top.jpg');
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    min-height: 100%;
    margin: 0px;
}

Answer 1

主体和 html 必须填充 100% 高度：

html, body {
    height: 100%
}

Answer 2

将此添加到您的超大屏幕 class:

min-height: 100vh;

工作fiddle：https://jsfiddle.net/dgo3sz0a/

为什么最小高度不适用于背景？

Why is min-height not working on background?

html

css

height

background

image