盒模型-邊框：
記住盒子的大小是由三部分決定的
要設置邊框，必須這三個同時設置，缺一不可
譬如：border-width: 10px 0;表示的是將上下邊框寬度設置爲10px 左右設置爲0
border-width: 10px 20px 0; 表示的是將上邊框設置爲10px 下邊框爲0 左右邊框爲20px。
這種簡寫方式比較重要，接下來還有很多種簡寫類似這種寫法。
邊框的簡寫：
簡寫只能同時設置四個邊框，但是快
盒模型-內邊距：
內邊距也可以簡寫，使用padding就可以設置四個內邊距，和border-width的規則是一樣的。
盒模型-外邊距：
重點：設置左和上外邊距 動的是自身，設置右和下外邊距 動的是其他的盒模型
我們經常將左右外邊距設置爲auto來達到子元素水平居中的效果。
水平居中：margin:auto 0;
而margin簡寫規則和padding一樣。
盒模型外邊距的重疊：
如果是父子元素，那麼設置子元素位置的方法有兩種，
- 子元素設置一個邊框或上內邊距使他們不相鄰。
- 父元素設置一個上內邊距使他們不相鄰 但是這兩種方法會導致盒模型大小發生改變，要注意
瀏覽器的默認樣式：
有些瀏覽器爲了顯示美觀是自帶樣式的，所以我們需要事先去除，用一個
*{margin:0;padding:0}
就可以了。
內聯元素的盒模型：
- 內聯元素不能設置weight和height；
- 內聯元素可以設置水平方向的內邊距；
- 內聯元素可以設置垂直方向的內邊距，且不影響頁面佈局。
- 內聯元素可以設置邊框，但垂直的邊框不會影響頁面佈局。
- 內聯元素支持水平方向外邊距，且不會重疊，只會求和
- 內聯元素不支持垂直外邊距