css padding (內距)、margin (外距)、border (邊框) 四邊向屬性值 (CSS padding, margin, border four direction values)

CSS需要寫四個邊向數位的屬性常用的有三個,padding (內距)、margin (外距)、border (邊框),寫四邊向數值的時候可以用不同的方式來寫,可以更快更好~
屬性加方向:
最簡單的寫法就是在這三個屬性的後面加上方向就可以,這是用在單純想指定某一邊向數值的時候。
padding-top: 5px; (上內距)
padding-bottom: 5px; (下內距)
padding-left: 5px; (左內距)
padding-right: 5px; (右內距)
 
margin-top: 5px; (上外距)
margin-bottom: 5px; (下外距)
margin-left: 5px; (左外距)
margin-right: 5px; (右外距)
 
border-top: 5px; (上邊框)
border-bottom: 5px; (下邊框)
border-left: 5px; (左邊框)
border-right: 5px; (右邊框)

屬性值寫四個數值:
padding: 5px 5px 5px 5px;
margin: 5px 5px 5px 5px;
border: 5px 5px 5px 5px;
四個數值分別是:上 右 下 左
屬性值寫三個數值:
padding: 5px 5px 5px;
margin: 5px 5px 5px;
border: 5px 5px 5px;
三個數值分別是:上 左右 下
屬性值寫兩個數值:
padding: 5px 5px;
margin: 5px 5px;
border: 5px 5px;
兩個數值分別是:上下 左右
屬性值寫一個數值:
padding: 5px;
margin: 5px;
border: 5px;
寫一個數值就是四個邊向都一樣的意思

css border(邊框)屬性

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *