本文和大家重點討論一下CSS中如何使用margin屬性定義網頁邊距，margin屬性包括margin-top,margin-right,margin-bottom,margin-left等。

CSS中margin屬性定義網頁邊距

margin屬性包括margin-top,margin-right,margin-bottom,margin-left,margin。

◆當他們要分別定義網頁的頂、右、底、左時用法有2種，他們分別為：

margin：top-valueright-valuebottom-valueleft-value；（順序是固定的上右下左，順時針。） 

margin-top:value;  
margin-right:value;  
margin-bottom:value;  
margin-left:value;  
 

◆當他們定義的網頁頂、右、底、左邊距是等同時，用這種方法：

margin：value；

例如:margin：10px20px20px40px；這個說明網頁的上右下左邊距分別為10、20、20、40.

或者也可以寫成這樣：

margin-top:10px;  
margin-right:20px;  
margin-bottom:20px;  
margin-left:40px;  
 

效果是一樣的。

一般常用舉例：

<styletypestyletype="text/CSS"> 
<!--  
#header{  
height:120px;  
width:960px;  
background-image:url(headPic.gif);  
background-repeat:no-repeat;  
margin:0px0px5px0px;  
}  
--> 
</style> 
<dividdivid="header"></div><!--網站的頭部--> 
<dividdivid="nav"></div><!--網站的導航--> 
<dividdivid="content"></div><!--網站內容--> 
<dividdivid="footer"></div><!--網站底部--> 

上面的代碼就是我們經常用到的div+css做的網站讓他的頭部和導航之間有5px的高度。
 

【編輯推薦】

1. margin-top屬性的語法和特征
2. IE6.0對padding的解讀分析
3. CSS margin 屬性定義和用法
4. CSS中margin-top和margin-bottom屬性使用說明
5. 技術分享 如何使用CSS控制超鏈接文字樣式