<div id="header">
...header info here...
</div>
<div id="content">
...content here...
</div>
<div id="right">
...right column info...
</div>
<div id="footer">
...footer info...
</div>

#content, #footer {
margin: 10px 190px 10px 10px;
}

索引頁
對索引頁來說,標記結構完全相同,因此不必復制一份共享的CSS規則,但是在#content左側加了額外的<div>作為第三欄(#left).

<div id="header">
...header info here...
</div>
<div id="content">
...content here...
</div>
<div id="left">
...left column info...
</div>
<div id="right">
...right column info...
</div>
<div id="footer">
...footer info...
</div>

對這份三欄結構來說,不僅要為#content與#footer設定右外補丁以容納右欄,還要設定左外補丁,容納新加進來的左欄.
但是先前已經把左外補丁設為10像素了,以配合只擁有雙欄的預設內文頁布局.
哇,我們卡住了,該怎么繼續呢?請繼續往下閱讀.

上一頁12 3 下一頁 閱讀全文