float和position都可以利用浮動對元素進行定位，但是有一點微小的區別
position使元素完全脫離文件流
float使元素半脫離文件流
什麼意思？
看下面的例子
我是class1
這是float的測試局
可以看到，class2中的文字都已經佔據class1的位置
使用float
我是class1
這是float的測試局
class2中的文字為class1的文字讓出了位置。可見，雖然float也脫離了文件流，但是文字依然會為這個元素讓出位置，環繞在周圍。最經典的就是float完成文字環繞效果。
更新：
position:relative
當你這樣設定，通過相對定位偏移後，其仍然會堅守著它原來佔據的空間，不會讓文件流的其它元素乘虛而入。這是與position:absolute的區別之一。
CSS之float屬性詳解
float屬性指定乙個盒子 元素 是否應該浮動，可以設定浮動方向。css語法 float left right none inherit 屬性值 值描述 left 元素向左浮動 right 元素向右浮動 none 預設值。元素不浮動，並會顯示在其文字 現的位置 inherit 規定應該從父元素繼承f...
CSS盒模型和float
一 盒模型 1 margin 外邊距 能使用負值，也可用畫素值 百分比 1引數 上右下左 2引數 上下 左右 3引數 上 左右 下 4引數 上 右 下 左 2 border 邊框 3引數 大小 型別 顏色 solid 實線 dotted 虛線 double 雙實線 3 padding內填充 不能使用...
CSS深入理解之float
float 屬性定義元素在哪個方向浮動。產生之初這個屬性總應用於影象，使文字圍繞在影象周圍，不過在 css 中，任何元素都可以浮動。浮動元素會生成乙個塊級框，而不論它本身是何種元素。如果浮動非替換元素，則要指定乙個明確的寬度 否則，它們會盡可能地窄。讓設定的標籤產生浮動效果，就是脫離原來頁面的標準輸...