height: 100% 或 min-height: 100% 对于 html 和 body 元素？

在设计布局时我设置了html, body元素'height to 100%但在某些情况下，这会失败，那么应该使用什么呢？

html, body {
   height: 100%;
}

or

html, body {
   min-height: 100%;
}

好吧，这不是基于意见的，因为每种方法都有其自身的缺陷，那么推荐的方法是什么？为什么？

如果您尝试将背景图像应用到html and body填满整个浏览器窗口，两者都不是。使用这个代替：

html {
   height: 100%;
}

body {
   min-height: 100%;
}

我的推理已给出here https://stackoverflow.com/questions/10947541/applying-a-background-to-html-and-or-body/10947583#10947583（我在这里全面解释如何以这种方式应用背景）：

顺便说一句，你必须指定的原因height and min-height to html and body分别是因为这两个元素都没有任何固有高度。两者都是height: auto默认情况下。它是具有 100% 高度的视口，所以height: 100%从视口获取，然后应用于body至少要允许内容滚动。

第一种方式，使用height: 100%在两者上，防止body一旦内容开始超出视口高度，就不会随其内容扩展。从技术上讲，这并不prevent内容无法滚动，但这确实会导致body在折叠下方留下间隙，这通常是不可取的。

第二种方式，使用min-height: 100%两者都不会导致body扩展到整个高度html因为min-height百分比不起作用body unless html有一个明确的height.

为了完整起见，CSS2.1第10节 http://www.w3.org/TR/CSS21/visudet.html包含所有细节，但它是一个极其复杂的阅读，所以如果你对我在这里解释的内容不感兴趣，你可以跳过它。