1.普通流：
- position : static – 元素框正常生成。即上述不對元素進行任何樣式設置的默認形態。
- position : relative (此時設置top, right, bottom, left生效) – 相對於它的原點定位，元素仍保持其未定位前的形狀，它原本所占的空間仍保留。
例如：
定位前：
定位后：
可以看出，div1相對於之前的位置，距離top偏移了40px，距離left偏移了60px。
注：top：40px指的是距上偏移40px，而不是向上偏移40px。
2.絕對定位：
- position : absolute – 將該元素從文檔流中刪除，原來的占位不再存在，並相對於其最近的已定位祖先元素定位（如果不存在已定位的祖先元素，則相對於其根祖先元素定位，即或<</span>canvas>）。不論該元素為塊級元素還是內聯級元素，定位后該元素將以塊級元素的形式顯示。
例如：
定位前：
定位后：
- position : fixed – 與absolute 大致相同，只是相對於當前視窗定位（即滾動條滑動時當前元素位置不會隨之改變）。
注1：絕對定位的元素不在文檔流中，因此會覆蓋其他元素。
注2：設置當前元素position : absolute時，應將其父元素position : relative。
3.浮動：
- l float : left 或float : right –- 將元素從原來的占位中刪除，向左或向右漂浮，直到碰到包含塊的邊框，或另一浮動元素的邊框為止。不論該元素為塊級元素還是內聯級元素，定位后該元素將以塊級元素的形式顯示。
注：只有在position為static或relative，或繼承了父元素的static或relative時，浮動才生效。
浮動場景：
- 浮動框總體寬度超過容器：浮動框塊下移，直到有足夠的空間
- 各浮動框高度不同：下移的浮動框有可能被“卡住”
