Box Modal
- 每個元素都會有 Box Modal ，有時候會忘記各自的範圍，以下圖片是我覺得最清楚最好了解的範例。
Box Model 的 Box 指的是 Border 以內（包含 Border）的範圍。
- Content：text 或 image 等等。
- Padding：在 Content 外面，Border 裡面的範圍。
- Border：Box 的範圍，Border Width 包含在 Box 裡面。
- Margin：在兩個 box 之間的空間範圍。
- Fill Area：設定 background color 或是 background image 所填滿的範圍。
box-sizing : border-box
一般來說，設定元素的 width 跟 height ，指的是 content 的 width 跟 height，但如果加上 padding 、 border ，整個元素的長寬就會跟我們設定的 width 跟 height 不一樣，看起來比較不直覺。
所以有一個屬性是 box-sizing 可以設定為 border-box，這樣在元素設定 width 跟 height 時，就會設定成 box 的長寬（包含 border width）。
在設定元素的長寬時就會更直覺喔！
