1.HTML中的3種布局方式
1.1 標準流
從左到右，從上到下顯示。要讓一個元素不在正常流中，唯一的辦法是讓元素浮動或定位。
1.2 浮動
1. 只要是脫離了標準流，元素都是不區(qū)分行、塊的，體現(xiàn)在任何元素都可以設置寬、高了。都有了
收縮的 性質(zhì)，就是不設置寬度，就自動縮減為里面內(nèi)容的寬度，沒有寬度時默認內(nèi)容撐開寬度；
2.脫離文檔流
3.浮動的邊界不會超過父元素，下一個浮動不會超過
4.提升層級半級。
5.浮動的元素有貼邊的性質(zhì)，絕對定位的元素可以自由定位。
- 對其他浮動元素的影響：后浮動的元素永不會超過先浮動元素的頂端。
- 對普通元素的影響：浮動元素會從文檔正常流中刪除，使得緊挨它的元素位置發(fā)生偏移，影響布局。
- 對文字的影響：浮動元素向下延伸時，不會影響正常文本的顯示，文本會相對于浮動元素進行偏移。但部分文本背景會被浮動元素遮住。
1.3 定位
CSS定位方式有四種：默認定位（static）、相對定位（relative）、絕對定位（absolute）和固定定位（fixed）inherit
-
static
沒有定位，元素在正常流中,top,right,bottom,left和z-index屬性無效。 relative
- 將元素position屬性設置為relative之后，再通過top,bottom,left,right屬性對其進行相對于原來位置的偏移；
2.元素偏移之后，他本來在默認文檔流中占據(jù)的位置仍然存在，其緊挨其后的元素的定位依據(jù)它本來的位置定位；
3.該元素偏移之后，可能存在覆蓋其他元素的情況，可以使用z-index屬性顯示層級有限級別
-
absolute生成絕對定位的元素，相對于static定位外的第一個父元素進行定位。
絕對定位的元素已經(jīng)脫離了文檔流，普通流中其他元素的布局就像絕對元素不存在一樣；
絕對定位的元素的位置是相對于最近的已定位的祖先元素，如果元素沒有已定位的祖先元素，它的位置就相對于body；
絕對定位的框可以覆蓋頁面的其他元素。
-
fixed
本質(zhì)上是一種絕對定位，不為元素預留空間。通過指定相對于屏幕視窗的位置來指定元素的空間，且元素的位置在屏幕滾動時不會發(fā)生變化。應用于很多網(wǎng)站頂端的固定導航、右下角的固定廣告等等。
absolute, relative, fixed偏移的參考點分別是什么？
absolute偏移的參考點是：最近的是relative或者absolute的父試圖進行定位。
relative偏移的參考點是：相對于元素在普通流中的原來位置，正常流中位置依舊存在，根據(jù)最近的父試圖進行定位。
fixed偏移的參考點是：相對于瀏覽器窗口，正常流中不存在，需要注意的是在移動端開發(fā)的時候盡量不要使用這個，因為在切換界面的時候會導致元素的抖動。
relative下，top和margin-top的區(qū)別
https://blog.csdn.net/lxiang222/article/details/70340084
http://www.itdecent.cn/p/4a1f36e9ca32
