那麼現在來教各位如何計算盒子 請看以下我畫得非常醜的圖
解釋:這個盒子的寬度為 267像素 高度26 像素
假設
我們現在設他 padding(內距) :10px
(PS: padding如果沒有個別指定 top right bottom left)屬性的話那麼他會統一
一個像素(margin border 也如此)，再來當padding左右設定了10px ，border設定了2px的話那麼他計算方式如下
Width :width(267)+ padding-left (6)+ padding-right(6) + border-left (2) + border-right(2)
Height height + padding-top + padding-bottom + border-top + border-bottom
由此可知 padding 與 border會影響到盒子本身大小
Margin 比較特別，它不會影響盒子本身的大小，但是它會影響和盒子有關的其他內容，因此 margin 是盒模型的一個重要的組成部分。