將div高度擴展到整個網頁

有沒有一種方法可以使用css將div的高度擴展到整個網頁？將div高度擴展到整個網頁

我不使用

.height 
{ 
    height:100%; 
    }

但這隻會延伸到的DIV裏面的內容的高度。 div應該覆蓋整個網頁，即使它裏面只有一行內容。

來源

2011-04-14 user544079

您是**不是**正在使用？ – alex 2011-04-14 23:57:00

<div><!-- make a <div> to hold everything in.. --> 

<div style="width:125;height:100%;">blah blah blah</div> 

<div style="height:100%;">blah blah blah</div> 

</div>

來源

2011-04-14 23:57:29

使用min-height屬性。

.height { 
    min-height: 100%; 
}

但它非常依賴於你沒有提供的上下文。

來源

2011-04-14 23:56:10 alex

這爲我工作：

<html> 
    <head> 
     <style type="text/css"> 
      body { 
       margin: 0; 
       padding: 0; 
      } 

      #wholepage { 
       height: 100%; 
       width: 100%; 
       background: red; 
       color: white; 
       font-weight: 800; 
       font-size: 22px; 
       font-family: sans-serif; 
      } 
     </style> 
    </head> 
    <body> 
     <div id="wholepage"> 
      Simple Test 
     </div> 
    </body> 
</html>

來源

2011-04-15 00:03:51 ohmusama

您可能必須指定<html>和<body>元素的高度：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 
<head> 
    <title>extend div height to entire webpage</title> 
    <style type="text/css"> 
     html, body { 
      height:100%; 
     } 
     #tehDiv { 
      height:100%; 
      background:red; 
     } 
    </style> 
</head> 
<body> 
    <div id="tehDiv">Example</div> 
</body> 
</html>

來源

2011-04-15 00:08:13

確保所有父項的高度設置。 html/body /等

元素將佔其父母高度的100％，但只有父母的身高有所增加。

100％非固定高度會導致另一個非固定高度;）

來源

2011-04-15 11:52:02 Edwin

感謝您實際解釋原因 – edgerunner 2011-09-17 14:21:35

將div高度擴展到整個網頁

回答

相關問題