創建一個div，可以隨着瀏覽器窗口的變化而垂直動態延伸

Question

這可能嗎？基本上我試圖創建一個div佈局，看起來像：

<div_wrapper> 

    <div_header> 
    </div_header> 

    <div_content> 
    </div_content> 

</div_wrapper> 

凡在網頁加載時，div_header佔地200像素，和div_content填補剩餘的垂直空間。而且，隨着瀏覽器更改大小（即用戶拖動瀏覽器的角落進行大小調整），div_header仍然保持在200px，而div_content會動態更改大小。

這可能嗎？謝謝。

Answer 1

我沒有看到div_header（任何問題）只是創建指明瞭CSS規則：

#header{height:200px;} 

你可以用js來調整你內容（）。如果包括jQuery的

$(document).ready(function(){ 
    $(window).resize(function(){ 
     $('#content').css("height", ($(window).height() - 200) + "px"); 
    }); 
    $('#content').css("height", ($(window).height() - 200) + "px"); 
}); 

希望這有助於

Answer 2

這應該做到這一點..

#wrapper{height:100%;} 
#header{ 
    height:200px; 
    float:left; 
    width:100%; 
} 
#content{ 
    height:100%; 
}