如何使身体以 100% 的最小高度和高度为自动答案

【问题标题】：How to make body take 100% min height and height as auto如何使身体以 100% 的最小高度和高度为自动
【发布时间】：2018-08-11 02:12:11
【问题描述】：

在我的页面上，我想让正文至少占视口的 100%（即当内容非常少时），但随着内容的增加而采用内容的高度。

现在我已经完成了

html{height:100%;}
body{height:100%;}

但是这样一来，如果内容增加，则 body 仅保持 100% 的视口高度，不会占用内容的高度。

如何解决这个问题？

【问题讨论】：

标签： html css

【解决方案1】：

body { min-height: 100vh; } 就是您所需要的。

【讨论】：

【解决方案2】：

html {
    height:100%;
}

body {
    min-height:100%;
    overflow-y:auto;
}

这应该可以了。

【讨论】：

【解决方案3】：

你可以用 css 做的是使用“vw”单位。只需将 body 的 , width, height, min-width 和 min-height 对应设置为 100vw/vh 即可；你也可以给出“box-sizing”：“border-box”，它应该在宽度和高度中包含边距和填充 2.如果您对 css 结果不满意，您可以随时使用 javascript。您必须编写一个函数，将视口宽度和视口高度赋予主体的宽度和高度，使用 jquery 你可以这样做

$( window ).width();//文档宽度 $(document).width();//文档宽度

同样适用于高度，当文档准备好时调用此函数

【讨论】：