如何使元素的高度等於屏幕的高度？

Question

我嘗試了height: auto; 但這不起作用。 有任何想法嗎？

Answer 1

html, body { height: 100%; }
#container { height: 100%; background: red; width: 200px; }

這是您要做什么？ 請提供一些代碼。

Answer 2

您有幾種選擇。 你可以做：

.element{
    position:absolute;
    top:0px;
    right:0px;
    left:0px;
    bottom:0px;
}

這樣，它將從第一個父元素的每一側開始都是0px，且位置不是靜態的。 如果它是頁面上的第一個元素，它將填充整個文檔正文。

看到這里發生了什么： http : //jsfiddle.net/4QH8H/embedded/result/

http://jsfiddle.net/4QH8H/light/

您也可以這樣做：

.element{

    height:100%;
    width:100%;

}

盡管這些屬性只能使它和父元素一樣高和寬，並且有時正文僅會包裹內容而不填充頁面，因此您必須執行以下操作：

html, body{

    height:100%;
    width:100%;

}