截面高度100％不起作用

Question

所以我试图制作＆＃34;部分＆＃34;使用section覆盖当前页面的完整高度。有点像this。正如您所看到的，宽度设置为100.而且我的代码是

.cont{
background: #009dff;
height: 100%;
} 

但由于某种原因，它似乎不起作用。这是demo。有什么想法吗？

Answer 1

这应该这样做。

http://jsbin.com/vijaxuyu/2/edit?html,css,output

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

html和body的高度％默认为100％。因此，您需要明确地通知您的浏览器。您必须分别指定height，有时min-height到html和body的原因是因为这两个元素都没有任何内在height。默认情况下，两者都是height: auto。视口具有100％的高度，因此从视口中取出height: 100%，然后将body作为最小值应用于允许滚动内容。