Question

是否可以拥有100％的高度，但div只能填满整个页面。

因此，如果我在div上放置100％的高度，它应该将div一直延伸到页面的末尾，但不再延伸以带来任何滚动条。那可能吗？我知道身高：100％占用页面的高度并将div的高度设置为该数字但我不希望div实际上具有该数字的高度，但只延伸到页面末尾，不超过该值。

是否可以100％高度或其他任何东西？

感谢您的帮助。

由于

Answer 1

你可以使用

<div style="top:0;bottom:0,left:0,right:0;"></div>

或使用jquery：

 $("#mydiv").height($(window).height());

Answer 2

如果您没有padding或border，如果您声明html，body和div 100％，它将扩展到浏览器的大小窗口。

如果您想使用padding和border，请考虑使用CSS3属性box-sizing: border-box;

Demo

<强>更新

使用伪元素（您可以使用空div）：

.top{height:100px; width:100%; position:absolute; top:0; left:0;}
.rest{min-height:100%; background:lightblue; }
.rest:before{content:''; display:block; width:100%; height:100px;}

Demo

仅100％高度填充页面

2 个答案: