概述
不論是簡單的頁面還是負責的頁面，都是一堆的盒子，無非是盒子裏麪包含盒子，或者是盒子和盒子肩並肩
【從CSDN來看佈局】
【從京東來看佈局】
【從網易雲課堂看佈局】
理論模型
模型的落地
標準盒子模型的寬度/高度 = content + padding + border + margin
兼容IE6~9的非標準盒子模型用hack標籤,hack就是*號，原理是在標準盒子模型的瀏覽器解析不了，不了了之；在IE6~9，先賦值200px，又解析300重新賦值。
#div1{ width:200px; *width:300px;}容器div標籤
- 自動換行
- 可以容納任何元素
margin（間隔）
- margin-top
- margin-bottom
- margin-left
- margin-right
可以使用這樣一次性的寫法
#div1{ margin:20px; }border（邊框）
- width：邊框粗細
- color：邊框顏色
- style：邊框樣式（solid-實線，dotted-點畫線，dashed-虛線，none-無線）
可以使用這樣一次性的寫法
#div1{border: 1px blue soild}padding（間隙）
- padding-top
- padding-bottom
- padding-left
- padding-right
可以使用這樣的一次性寫法
#div1{ padding:20px; }