如何用css實現這個特定的佈局？

enter image description here

到目前爲止，這裏是HTML我有：

<body> 
<div id="content"> 
<div id="header"> 
</div> 
<div id="nav"> 
</div> 
<div id="footer"> 
</div> 
</div> 
</body>

和CSS：

#content{ 
margin:0 auto; 
height:1200px; 
width:1000px; 
border:2px solid black; 
} 
#header{ 
margin:0 auto; 
width:inherit; 
height:200px; 
border-bottom:2px black solid; 
} 
#nav{ 
margin:0 auto; 
width:inherit; 
height:50px; 
border-bottom:2px solid black; 
} 
#footer{ 
width:inherit; 
border-top:2px solid black; 
margin-top:-1200px; 
height:200px; 
clear:both; 
}

的問題是與頁腳 - 它不像圖中那樣。

你能告訴我我的代碼有什麼問題嗎？請不要給我一些其他代碼，因爲我是CSS新手。

來源

2013-09-25 Karn Singh

爲什麼您的頁腳上有'margin-top：-1200px'？而且，即使這樣既不能修復也不能破壞任何東西，爲什麼你在頁腳上都清楚地說明了這兩點？「明確：兩者都應該這樣做？ – Adam

您的頁腳向上移動，因爲您有保證金頂部：-1200px

來源

2013-09-25 18:25:09 Dale

如何用css實現這個特定的佈局？

回答

相關問題