2011-11-30 96 views
0

我正在啓動將使用HTML/CSS的應用程序。雖然我對兩種技術非常熟悉,但在創建默認佈局時遇到了問題。基本上,我想要以下內容:使用HTML和CSS佈局內容

|-------------------------------------------------------------| 
|                | 
| This section will be as large as the content that it holds | 
|                | 
|-------------------------------------------------------------| 
|                | 
|                | 
| This section will take up the remaining available space. | 
| No matter what. If more space is required, scroll only this | 
| content.             | 
|                | 
|                | 
|-------------------------------------------------------------| 
|                | 
| This section will be as large as the content that it holds | 
|                | 
|-------------------------------------------------------------| 

如何使用HTML/CSS來實現此目的?

+0

[cssstickyfooter.com](http://www.cssstickyfooter.com/)是一個很好的地方去尋找;它會將您的第三個面板保持在頁面底部。 – Bojangles

+3

請同時發佈您的嘗試。 – Mahesh

回答

0

使用HTML5和CSS,我們將調用頂部<header>和底部,<footer>,語義參考。我們還會打電話給您的內容<article>的中心部分。

如果同時設置了<header><footer>position: fixed;僅中心部分或<article>將滾動。看看我的結果在下面鏈接jsfiddle。十分簡單!

實施例: http://jsfiddle.net/codesushi156/5wc25/4/