（注1：如果有問題歡迎留言探討派近，一起學習腾节！轉載請注明出處建瘫，喜歡可以點個贊哦Ｕ负础）
（注2：更多內容請查看我的目錄。）
1. 簡介
我們之前談到了盒模型啰脚，那么這若干個盒子是怎么堆砌成一個完整的網頁呢殷蛇？
主要有三種定位機制：普通流，浮動和絕對定位橄浓。我們仍然以隊形為例來講解這三種定位機制粒梦。
2. 普通流
最普通的站隊方式是怎樣的呢，一般是站成幾排幾列荸实。從前到后匀们，從左到右依次排列。普通流就是這樣的准给，塊級元素從上到下泄朴，行內元素從左到右依次排列重抖。至于塊級元素和行內元素的區(qū)別和定義我們會在下一章詳細講解。
3. 定位
默認的隊形站好了祖灰，教官還可以通過喊口號來改變隊伍的隊形仇哆。CSS也提供了position屬性，控制隊伍的定位夫植。
- static 默認定位讹剔，元素框按照塊級元素從上到下，行內元素從左到右依次排列详民，在普通文檔流中延欠。就是最原始的隊形。
- relative 相對定位沈跨，元素相對static的位置偏移某個距離由捎，但他原來的位置仍保留，在普通文檔流中饿凛。就好比教官喊狞玛，XX出列，向前一步涧窒，向右三步走心肪。這時候你人不在原本的位置了，但你本來的位置仍然保留了纠吴。
- absolute 絕對定位硬鞍，元素相對其非static定位的第一個祖先元素（包括父元素）進行定位，若沒有該類祖先元素戴已，則會相對body進行定位固该。其原來的位置不存在了，通過 "left", "top", "right" 以及 "bottom" 屬性進行定位糖儡，脫離了普通文檔流伐坏。就好比教官喊XX出列，后續(xù)同學補齊XX位置握联，XX仿佛不存在于原隊伍中一樣桦沉。然后命令XX相對于其非static的大集體，靠左多少步拴疤，靠上多少步站位永部。站位以后可能會與原隊友位置重疊，誰露出呐矾，由z-index屬性決定。（具體的覆蓋規(guī)則可以看CSS入門11-定位與覆蓋）
- fixed 固定定位懦砂，元素框的表現(xiàn)類似于將 position 設置為 absolute蜒犯，不過其包含塊是視窗本身组橄，脫離了普通文檔流。就是仍然是自由人罚随，但是你的位置是相對于整體隊伍所在的場地來定義的玉工。
4. 浮動
浮動的元素，就是從原文檔流將該元素框拿出來向左或是向右滑動淘菩，直到碰到另一個浮動框或者邊緣為止遵班。就好比教官說第二排，向左浮動潮改，第二排就會從隊伍中出來狭郑，和第一排重合，第三排往后都往前一排走汇在。如果命令每一排都向左浮動翰萨，則所有隊伍站成了一排。
參考：
CSS 定位 (Positioning)
脫離文檔流分析
css定位流布局
CSS中的三種基本的定位機制（普通流糕殉、定位亩鬼、浮動）
CSS定位的三種機制：普通流、絕對定位和浮動
html/css基礎篇——DOM中關于脫離文檔流的幾種情況分析
CSS position絕對定位absolute relative
CSS絕對定位absolute詳解
