如何使div viewport的高度，而不是CSS中的頁面高度？

Question

所有使用top: 0em; bottom 0em;的建議都不正確。如果頁面比視口高，那麼代碼會將d​​iv拉伸到視口底部之外。

其他建議使用100vh不幸的是沒有足夠的支持（我需要它在4.4之前的Android瀏覽器中工作）。

這是可能的只有CSS？

Answer 1

要使元素的高度達到100％，請將html，body和元素的高度設置爲100％。

html, 
body, 
#your-element { height:100%; } 

編輯 - 摘錄：

* { margin:0; padding:0; } 
 
html,body,div { height:100%; } 
 
div { background: #0f0; }

<div></div> 
 
<br> 
 
<br> 
 
<br> 
 
<br> 
 
<br> 
 
<br> 
 
<br> 
 
<br> 
 
<br> 
 
<br> 
 
<br> 
 
<br> 
 
<br> 
 
<br> 
 
<br> 
 
<br> 
 
<br> 
 
<br> 
 
<br> 
 
<br> 
 
<br> 
 
<br> 
 
<br> 
 
<br>

Answer 2

如果你的容器可以是固定的，你可以只使用height: 100%

如果你需要的任何其他的定位，將需要使用JavaScript來做到這一點。