盒子模型
作用：盒子模型是用來描述一個元素的寬高，邊框，內容，距離，邊框的大小以及元素與元素的距離
從內到外盒子模型有這幾個屬性組成
- width 內容寬度 height 內容高度
- padding-top、padding-right、padding-bottom、padding-left
==padding是內邊距，內容距離盒子內邊緣的距離== - border 邊框 邊框只有厚度（高度），沒有寬高，border也分別為四個方向
- margin-top、margin-right、margin-bottom、margin-left
==margin是位邊距 元素元素之間的距離==
image
widht/height 內容的寬度和高度，和整個盒子的寬高四兩個概念
-
padding 內容邊緣距離盒子邊框內邊緣的距離，有四個方向，有不同的寫法
- padding-top、padding-right、padding-bottom、padding-left
- padding: 10px 20px 30px 40px; 上 右 下 左
- padding: 10px 20px 30px; 上 左右 下
- padding: 10px; 四個方向都是10px;
border 邊框 由寬度 樣式 顏色，默認一個盒子的邊框寬度為3px，樣式為無，顏色為黑色
這三個屬性如果沒有設置樣式，邊框也不會出現
