盒模型

盒模型就是一個矩形的標籤：

，用該標籤將元素組合在一塊兒，再利用盒模型的屬性對頁面佈局進行調整；

屬性：margin border padding width height bg;

1.margin:盒模型的外邊距，是元素與元素之間的距離； margin能夠只設一個值，表示四周都有相同的margin； 也能夠設置兩個值，第一個表示上下的margin，第二個表示左右的margin； 也能夠設置三個值：第一個是上邊距的margin，第二個是左右的margin，第三個是下方的margin； 也能夠設置四個值：分別是margin-top，margin-right，margin-bottom，margin-left； 也能夠分別設置margin-top，margin-right，margin-bottom，margin-left四個方向的margin；

2.border：能夠給盒子設置邊框，border:2px solid red;三個屬性分別是邊框的寬度、邊框類型和顏色；

3.padding：是盒模型的內邊距，是盒子內部元素與盒子邊界的距離；設置方式和margin類似；

4.width和height：是盒子內容的寬和高；一個盒子佔據的大小是由margin-left + borderleft +padding-left+ width+height+padding-right+border-right+margin-right；盒子大小則是去掉margin；

5.bg:background:能夠放入圖片也能夠設置顏色做爲背景；