CSS的`margin`屬性用於設定元素的外邊距,它是一個簡寫屬性,可以通過它來設定一個元素的上、右、下、左邊距。以下是`margin`屬性的使用方法:
單獨設定邊距:可以使用`margin-top`、`margin-right`、`margin-bottom`和`margin-left`來分別設定元素的上、右、下、左邊距。
簡寫形式:`margin`屬性也可以接受1到4個值,以空間分隔,來設定邊距:
一個值:例如`margin: 10px;`,表示所有四個方向的外邊距都是10px。
兩個值:例如`margin: 10px 20px;`,第一個值設定上下邊距為10px,第二個值設定左右邊距為20px。
三個值:例如`margin: 10px 20px 30px;`,順序為上、右、下,分別設定為10px、20px、30px。
四個值:例如`margin: 10px 20px 30px 40px;`,順序為上、右、下、左,分別設定為10px、20px、30px、40px。
邊距的單位:邊距的值可以是像素(px)、百分比(%)、em等單位。
邊距的關鍵字:`margin`屬性還接受`auto`和`inherit`兩個關鍵字。`auto`用於讓瀏覽器自動計算外邊距的大小,通常用於設定塊級元素水平居中或平均分配空間;`inherit`用於繼承父元素的外邊距。
例如,以下CSS規則設定了元素的外邊距:
```css
div {
margin: 20px; /* 所有方向的外邊距都是20px */
margin: 20px 40px; /* 上邊距20px, 右邊距40px, 下邊距20px, 左邊距40px */
margin: 20px 40px 60px; /* 上邊距20px, 右邊距40px, 下邊距60px, 左邊距40px */
}
```
以上就是CSS中`margin`屬性的基本用法。