文本流：
文檔的讀取和輸出順序，也就是我們通?？吹降挠勺蟮接?、由上而下的讀取和輸出形式。
脫離文檔流的情況：
1、float 浮動
浮動會脫離文檔流而不會脫離文本流，其他盒模型中的文字還是會為其讓出位置，> 環(huán)繞在其周圍
2、position：absolute/fixed 絕對定位
絕對定位會使元素脫離文檔流同時脫離文本流，其他盒模型元素和其中的文字的排> 列都會忽略它
文檔流和文本流可以理解為定位/位置
文檔流處在網(wǎng)頁的最底層，它表示的是一個頁面中的位置，我們所創(chuàng)建的元素默認(rèn)都處在文檔流中
元素在文檔流中的特點(diǎn)
1.文檔流指的是元素排版布局過程中，元素會默認(rèn)自動從左往右，從上往下的流式排列方式。并最終窗體自上而下分成一行行，并在每行中從左至右的順序排放元素。
2.浮動(float)、絕對定位(absolute)、固定定位(fixed)三種方式定位會脫離文檔流。 同時上面的兩種定位還能讓浮動失效。
3.元素分為三種大的類型 塊狀 內(nèi)聯(lián) 內(nèi)聯(lián)塊 每一種有自己的特性。
塊狀：獨(dú)占一行 在父元素內(nèi)一行內(nèi)只有它自己，不能放下其它元素。支持所有css樣式 。
默認(rèn)繼承父元素100%的寬（不設(shè)寬）
內(nèi)聯(lián)(行內(nèi)元素)：內(nèi)容撐開寬度 ，不獨(dú)占一行?？梢栽O(shè)置寬高，但不會有作用，可以設(shè)置左右的margin,border,padding。
脫離文檔流會發(fā)生什么呢？
- 1.會打亂元素的排序規(guī)則，設(shè)置浮動，定位后會按照自己設(shè)置的屬性值來擺放
- 2.讓各類型元素失去原來各自的特性，變成同一種元素。
? 浮動會讓元素有塊元素部分性質(zhì)，如：支持所有css樣式，子元素和內(nèi)容能撐開自身（不設(shè)置） 。 但是不會獨(dú)占一行，不能繼承父元素寬高。（給元素只設(shè)置高，然后浮動元素，元素會因?yàn)闆]有寬度而無法顯示）
? 對于父元素來說，脫離了文檔流的子元素不能再撐開父元素了，所以會出現(xiàn)高度塌陷的問題。
標(biāo)準(zhǔn)文檔流等級
分為兩種等級：塊級元素和行內(nèi)元素
內(nèi)聯(lián)元素文檔流
內(nèi)聯(lián)元素的文檔流是從左往右流動的，當(dāng)一行滿了之后會另起一行從新開始
1).與其他元素并排2).不能設(shè)置寬、高。默認(rèn)的寬度就是文字的寬度
塊級元素文檔流
塊級元素文檔流是從上往下依次流動的，每個塊級元素占滿一行
1).霸占一行，不能與其他任何元素并列2).能接受寬、高3).如果不設(shè)置寬度，那么寬度將默認(rèn)變?yōu)楦赣H的100%，即和父親一樣寬
脫離文檔流
float使用
浮動元素是如何定位的
當(dāng)一個元素浮動之后，它會被移出正常的文檔流，然后向左或者向右平移，一直平移到碰到了所處的容器的邊框，或者碰到了另外一個浮動的元素。
浮動屬性
[if !supportLists]1. [endif]只有橫向浮動，并沒有縱向浮動。2.當(dāng)元素應(yīng)用了float屬性后，將會脫離普通流，其容器（父）元素將得不到脫離普通流的子元素高度。3.會將元素的display屬性變更為block
浮動元素的后一個元素會圍繞著浮動元素（典型運(yùn)用是文字圍繞圖片），與應(yīng)用了position的元素相比浮動元素并不會遮蓋后一個元素。5.浮動元素的前一個元素不會受到任何影響（如果你想讓兩個塊狀元素并排顯示，必須讓兩個塊狀元素都應(yīng)用float）
清除浮動
1.父元素高度塌陷
子元素浮動，父元素沒有設(shè)置高度，子元素就無法撐開父元素 ，父元素高度就為0。
2.元素浮動后影響到其他同級元素或者父元素元素的內(nèi)容文字
前面提到過文檔流和文本流，一個元素的內(nèi)容文字等就是文本流。元素浮動后上升一個高度到文本流，給一個父元素內(nèi)的子元素浮動后，父元素的文字會對浮動元素進(jìn)行環(huán)繞。
浮動元素只能影響寫在他后面的元素，兩個塊狀同級元素，給第一個浮動，就會遮蓋第二個元素。
