CSS外邊距屬性(margin)的使用方法
CSS外邊距屬性(margin)的使用方法
外邊距是頁面中設定元素與另一個元素之間距離的屬性，如果想完全使用CSS佈局代替傳統table佈局，那就需要好好掌握外邊距的特性。
Html中有些標籤帶有預設的margin屬性，比如<p>和<body>，在重新設定它們的值後就會覆蓋預設樣式。
按照設定方位不同，margin有四個屬性：
上邊距（margin-top）
定義元素上方外邊距的寬度，有三個屬性值：
·長度，用絕對長度和相對長度定義一個值。
·百分數，基於父層元素的寬度的百分數。
·auto，瀏覽器自動設定，多為居中顯示。
示例：
#sbj {margin-top:5px;}
右邊距（margin-right）
和上邊距相同，它定義元素右方外邊距的寬度，設定方法和上邊距margin-top相同。
下邊距（margin-bottom）
和以上兩屬性相同，設定元素下方外邊距寬度。
左邊距（margin-left）
和以上三屬性相同，設定元素左方外邊距寬度。
外邊距（margin）
margin是外邊距的綜合寫法，它可以同時定義上下左右四個方向的外邊距寬度，定義順序是順時針的上-右-下-左。
margin：top right bottom left；
和前面padding、border中介紹的一樣，margin屬性值的定義數量和它的方向是對應的。如果設定了四個值，則按照上右下左的順序顯示出效果；如果只設置一個值，將作用於四個邊；如果定義兩個值，第一個作用於上下，第二個值作用於左右；如果定義三個值，第一個作用於上方，第二個值作用於左右，第三個值作用於下放。
示例：
#qbj01 {margin:5px;}
#qbj02 {margin:5px 1em 2cm 15%;}
#qbj03 {margin:10mm 2px 3%;}
注意：
外邊距margin的值可以是負值。
外邊距margin總是透明的，不能加背景。
Netscape和IE瀏覽器的<body>的margin預設值為8px，opera瀏覽器為0，但opera瀏覽器的內邊距padding為8px，所以要想讓它們的顯示效果相同必須先進行margin的自定義。
（轉）