如何将页面扩展到全屏

Question

我有一个包含元素的页面，但我需要将其用尽。所以。我试图做到这一点，但是当我做到这一点时，页面大小就变得固定了。如何解决？ 例子：

html, body {
    height: 100%;
    bottom: 0;
}

.main-body{
    height: 100%;
    background: deepskyblue;
    bottom: 0;
}

.main-line{
    height: 95%;
    background: aliceblue;
}
.footer{
    bottom: 0;
    width: 100%;
}

因此，通过此代码，它变成了固定大小的example

如果我尝试修复此问题，则页面会显示类似this

的内容

html, body {
    height: 100%;
    bottom: 0;
}

.main-body{
    background: deepskyblue;
    bottom: 0;
}

.main-line{
    background: aliceblue;
}
.footer{
    width: 100%;
}

Answer 1

为什么有身体和主体？

这是正确的：

html, body { height: 100%; }
body { background-color: deepskyblue; }