在了解CSS中的浮動和定位之前有必要先了解清楚標准流和脫離標准流的特性
標准流的默認特性
1、分行、塊級元素，並且能夠dispay轉換。
2、塊級元素（block）：默認獨占一行，不能並列顯示，能夠設置寬、高，寬度為父盒子的100%。例如：div、p、標題元素（h1-h6）、列表元素（ul li、dl dt dd）
3、行內元素（inline）：默認並排顯示，不能設置寬、高，寬度為內容的寬度。例如：span、a、b、i
4、margin-bottom 和margin-top 塌陷，以最大值為准。
脫標的元素的特性
只要是脫離了標准流，元素都是不區分行、塊的，體現在任何元素都可以設置寬、高了。都有了收縮的 性質，就是不設置寬度，就自動縮減為里面內容的寬度。
浮動的元素有貼邊的性質，絕對定位的元素可以自由定位。
浮動float
浮動可以使塊級元素並排顯示，用於頁面布局。
注意：某個元素設置了浮動，則同級元素都需要設置浮動。
有高度的父盒子不用清除浮動，否則都需要清除浮動：
1）給父盒子加 { overflow: hidden;_zoom:0 /*IE6 的兼容性問題*/}
2）隔牆法：給浮動元素的父盒子下加牆.clear{ clear: both;height: 10px;_font-size: 0; /*IE6 的兼容性問題*/}
定位position
- position:relative; 相對定位
- position:absolute; 絕對定位
- position:fixed; 固定定位
- position:static;默認，沒有定位
1、position: relative;
相對定位不脫標，僅設置position: relative 沒有任何效果
相對定位是相對自己原來的位置進行移動，原位置保留，margin 將作用在原位置上
相對定位的用途非常的小，就是微調元素的位置
2、position:absolute;
絕對定位top left 是以頁面左上角作為參考。在實際應用中很少單獨使用，通常會“子絕父相”給父盒子設置position: relative;（相對定位），這樣子盒子會以父盒子作為參考。
1）絕對定位的盒子，不能以任何方式用margin 影響別的盒子
2）父盒子的padding 不會影響絕對定位的子盒子
3、position:fixed;
相對於瀏覽器窗口為參考定位
CSS中能夠脫標的屬性有3個：
- float:left/right
- position:absolute; 絕對定位
- position:fixed; 固定定位