浮動
float是css樣式中的定位屬性，用於設定標籤的居左浮動和居右浮動，浮動後的元素不屬於HTML文件流，
需要用清除浮動把文件拽迴文檔流中。（float值：  left 向左浮動；right 向右浮動）


網頁中大部分物件預設是佔用文件流，不過有四種情況使得元素離開文件流：浮動float、絕對定位absolute、相對瀏覽器定位fixed、元素不顯示display：none；這四種情況不佔文件流的空間。


清除浮動方法：  寫一個空的div,然後給div新增clear：both屬性
加浮動的目的是讓兩個元素可並排顯示，如果清除浮動，只是讓塊元素脫離文件流的特性消失，而並排顯示的特性還在。
如：
.d1{width: 200px;height: 200px;background: red;float: left;}
.d2{width: 200px;height: 200px;background:yellow;float: left;}
.d3{width: 300px;height: 300px;background: green;}
.clear{width: 0px;height: 0px;clear: both;}


<div class="d1">第一</div>
<div class="d2">第二</div>
<div class="clear"></div>
<div class="d3">第三</div>


定位
通過position這個屬性來定義，position屬性是指本體相對於上級的定位，position定位又分絕對定位和相對定位。它的預設值是static，意味著元素沒有被定位，出現在文件流中應該出現的位置。
如果用position來佈局頁面，父級元素的position屬性必須為relative或absolute。行元素加了position：absolute後可設定寬和高（加了float和fixed以後也可以設寬和高）


常見屬性值：正常的文件流static relative；脫離文件流absolute fixed。
static 無特殊定位，物件遵循正常的文件流
relative 物件遵循正常文件流
absolute 物件脫離正常文件流，使用top，right，left，bottom等屬性進行絕對定位。如果不指定父級定位容器，將以瀏覽器視窗進行定位。
fixed 物件脫離正常文件流，使用top，right，left，bottom等屬性以瀏覽器視窗為參考點進行定位，當出現滾動條是， 物件不會隨之滾動。


z-index 可以改變元素的疊放順序，只有用了脫離文件流（absolute、fixed）時使用其他情況不起作用。
如：
 div{width: 200px;height: 200px;}
.d1{background: red; position: absolute;z-index: 1999;}
.d2{background:green;z-index: 900;position: absolute;}


<div class="d1">第一</div>
<div class="d2">第二</div>


display屬性
css規定，每個網頁元素都有一個display屬性，使用者確定該元素的型別。預設display屬性值為“block”，稱為塊元素，而span的預設display屬性值為“inline”，稱為行內元素。
display常見屬性值
none 隱藏物件
inline：內聯元素
block 塊元素
inline-block 內聯塊元素
table-cell 表格單元格（通常配合vertical-align：middle；text-align:center;使大小不一樣的圖片（或其他元素）可以居中顯示）