觀看金魚都能懂網頁設計入門 8
以上面範例來計算：
| 看得到的尺寸 | 看不到的尺寸 |
|---|---|
| width + border + padding | margin |
| 內容寬度+邊框+內推 | 外推 |
物件整體寬度：width + border + padding
物件整體寬度：300px + 20px + 40px
P.s 在畫面中，margin不能算是物件的整體寬度，它是兩物件往外推的距離，但他同樣會在畫面中佔據寬度，因此被稱為看不到的尺寸
https://codepen.io/mikeyam/pen/YzqOgQJ
可以透過以上範例在練習。
padding 及 margin 寫法相同|
------------- | -------------
padding:20px; |上下左右各20px
padding:16px 20px; |上下各16px，左右各20px
padding:10px 30px 20px; |上 10px，左右 30px，下 20px
padding:10px 3px 30px 5px; |上，右，下，左（順時鐘方向）
iThome鐵人賽
看影片追技術