盒子模型的概念
盒子模型就是把HTML頁面中的元素看作是一個矩形的盒子，也就是一個盛裝內(nèi)容的容器。每個矩形都由元素的內(nèi)容、內(nèi)邊距（padding）、邊框（border）和外邊距（margin）組成。
網(wǎng)頁就是多個盒子嵌套排列的結果。
內(nèi)邊距出現(xiàn)在內(nèi)容區(qū)域的周圍，當給元素添加背景色或背景圖像時，該元素的背景色或背景圖像也將出現(xiàn)在內(nèi)邊距中。（IE6的盒模型的bug：背景色不能穿透邊框）
外邊距是該元素與相鄰元素之間的距離。
如果給元素定義邊框屬性，邊框將出現(xiàn)在內(nèi)邊距和外邊距之間。
注意：雖然盒子模型擁有內(nèi)邊距、邊框、外邊距、寬和高這些基本屬性，但是并不要求每個元素都必須定義這些屬性。
????邊框屬性—設置邊框樣式（border-style）
作業(yè)：圣誕樹模型
內(nèi)邊距屬性：
padding屬性用于設置內(nèi)邊距，也是復合屬性，相關設置如下：
padding-top:上內(nèi)邊距 ? ? ? ? ? ? ? ? ? ?padding-right:右內(nèi)邊距
padding-bottom:下內(nèi)邊距 ? ? ? ? ? ? ??padding-left:左內(nèi)邊距
padding:上內(nèi)邊距[右內(nèi)邊距下內(nèi)邊距左內(nèi)邊距]
內(nèi)邊距是享有背景色的。
外邊距屬性：
margin-top:上外邊距 ? ? ? ? ? ? ? ? ? ?margin-right:右外邊距
margin-bottom:下外邊距 ? ? ? ? ? ? ?margin-left:上外邊距
margin:上外邊距 ?右外邊距 ?下外邊距 ?左外邊距
margin:上下外邊距 ?左右外邊距
margin相關屬性的值，以及復合屬性margin取1~4個值的情況與padding相同。
外邊距可以使用負值，使相鄰元素重疊。
對塊元素應用寬度屬性width，并將左右的外邊距都設置為auto，可使塊級元素水平居中，實際工作中常用這種方式進行網(wǎng)頁布局，示例代碼如下：header{ width:960px; margin:0 auto;}
為了更方便地控制網(wǎng)頁中的元素，制作網(wǎng)頁時，可使用如下代碼清除元素的默認內(nèi)外邊距：
注意：使用margin定義塊元素的垂直外邊距時，可能會出現(xiàn)外邊距的合并。
