傳說寶箱 - Box
(建議以電腦閱讀此篇)
在開發人員模式中可以視覺化「寶箱」的外觀，如：
.demo {
width: 160px;
height: 90px;
border: 5px #000 solid;
padding: 11px 12px 13px 14px;
margin: 19px 18px 17px 16px;
line-height: 90px;
}
 |
 |
margin 是 邊框(border)外部的間距：上圖橘色的部分
padding 是 邊框(border)內部的留白：上圖綠色的部分
margin、padding 設定的參數有三種模式：
padding: 12px;
一個參數：表上下左右都同一個數值
padding: 3px 8px;
兩個參數：分別為 上下 與 左右
padding: 1px 2px 3px 4px;
四個參數：分別為 上、右、下、左
或是直接用指定名稱設定數值
有 top、bottom、left、right 四種可用，如：
margin-top: 1px;
padding-right: 2px;
margin-bottom: 3px;
padding-left: 4px;
數值的部分可以設 數字(12px)、百分比(80%)、自動(auto)，如：
.demo {
padding-top: 10%;
margin: auto;
padding-right: 32px;
}
如有錯誤，歡迎在下方留言討論喔 ~
達人
