一、浮動與定位
二、彈性盒子
——最好加指定瀏覽器前綴
將父元素指定爲display：box(/inline-box/inline-flex)時，子元素就變爲彈性盒子遵循父元素制定的排序方式。不遵循標準流的規則。
box-orient: 排列方式
horizontal;橫向排列
vatical;縱向排列
box-pack: 子元素的對齊方式——基於父元素
start; 從開始位置對齊（大多數等同於左對齊）
center; 居中對齊
end; 從結束位置對齊
justify； 兩端對齊
box-align: 子元素的對齊方式——基於子元素本身
start;
end;
center;
baseline; 子元素基線對齊
stretch; 子元素自適應父元素尺寸
box-flex: 子元素所佔父元素剩餘空間的比例
number;
box-direction: 子元素是否反序排列
reverse; 反序
normal; 正常順序（默認）
box-flex-ground: 子元素所屬組
——動態給元素內容所需空間，父元素所剩空間分給其他元素。
1;（默認）
<intager> 整數值
box-ordinal-ground: 顯示順序——相同組（相同值）的元素顯示順序
1; （默認）
<intager> 整數值
box-lines: 子元素是否可以換行顯示
single; 子元素只在一行內顯示
multiple; 自動換行
三、960 佈局
官網/960.gs
12列:單元格寬60px;
16列: 40px;
24列: 20px;
每個單元格兩邊都有10px的margin值;
引入: 960.css(網格)
resrt.css(清除樣式)
text.css(樣式重置)
類名
.container_num(12/16/24) 主容器; 自動居中
.grid_num(1-12/1-16/1-24) 網格類; 代表元素應占num個網格
.clear 清除上一行的網格對下一行元素的影響;
.alpha 清除元素左邊的margin值;
.omega 清除元素右邊的margin值;
.pull_num 將元素向左拉num個網格;
.push_num 將元素想右推num個網格;
.prefix_num 在元素前面加num個網格的padding-left;
.suffix_num 在元素後面加num個網格的padding-right;