<div id="wrap"> <header>這裡放logo、選單</header> <main>這裡放內容</main> <footer>這裡放版權</footer> </div>
css
#wrap { background-color: #8E8E8E; width: 990px; margin: 0 auto;/*區塊置中*/ } header { background-color: #8DA1D8; height: 200px; margin-bottom: 10px; } main { background-color: #FFF242; height: 1000px; margin-bottom: 10px; } footer { background-color: #178C2F; height: 100px; }
<div id="wrap"> <header>檔頭</header> <aside>側欄</aside> <main>內容</main> <footer>頁尾</footer> </div>
css
#wrap { width: 990px; background-color: #686868; } header { background-color: #E37C7E; /*height:200px;*/ margin-bottom:10px; } aside { background-color: #87B3D7; height:100px; width:190px; margin-bottom:10px; margin-right:10px; float:left; } main { background-color: #4D95BD; height:100px; width:790px; margin-bottom:10px; float:left; } footer { background-color: #561718; /*height:100px;*/ clear:both; }