在前端頁面開(kāi)發中(zhōng)，要實現複雜(zá)頁面的布局，必須根據不同的設計尋求不同的CSS定位機制。CSS有三種基本定位機制：标準流，浮動，定位，今天小(xiǎo)編先給大(dà)家介紹一(yī)下(xià)标準流和浮動。

1、标準流(normal flow)：

标準流又(yòu)被稱爲“文檔流”或“普通流”。

标準流是指文檔内元素的流動方向。内聯元素從左到右，遇到阻礙換行執行;塊級元素獨占一(yī)行，從上往下(xià)排列。

2、浮動(float)：

浮動是指具有标準流屬性的元素會脫離(lí)标準流的标準控制，移動到其父級元素的指定位置的過程。這種現象我(wǒ)(wǒ)稱爲脫離(lí)标準流，“脫标”。

float有三種屬性：

left 元素向左浮動

right 元素向右浮動

none 元素不浮動(默認狀态)

給第一(yī)個子元素的添加浮動屬性之後，第一(yī)個盒子“脫标”了，浮動在藍(lán)色的盒子之上，并且不會超過父元素的内邊距範圍，還有一(yī)個隐藏的特點就是盒子浮動之後會具有行内塊元素的特性，以上可以總結爲浮動的特性;

float的特性：

1.浮動的元素不占位置，脫離(lí)标準流，影響标準流，漂浮在其他标準流盒子的上面。

2.添加浮動的元素以最近的父級元素進行浮動對齊，但不會超過内邊距的範圍。

3.添加了浮動的元素，會具有行内塊元素的特性。