HTML标记未涵盖完整内容

Question

我希望我的html标记覆盖网页溢出时的所有内容，但如果我将html标记设置为100％，则只覆盖屏幕高度和宽度的100％。

示例：JSFiddle。

如何使html代码始终覆盖内容？

提前致谢！

Answer 1

是的，这是它的工作原理。
如果你让高度为空或自动，它将适应内容。

Answer 2

试试这个：

html, body{
    width: 100%;
    height:max-content;
}

Answer 3

百分比高度是根据父母的身高计算出来的。

由于html没有父高，因此得到视口高度，这不是你想要的。

您实际想要做的是省略 html标记上的高度声明，然后您的.container高度将展开以包含其所有内容（因为父不再有高度，它可以扩展到它想要的数量。）

如此简单

html, body{
   width: 100%; // no height declaration
}

会做到这一点。