網頁布局的3種方式：
如何讓塊級div水平排列成一行？
雖然可以將div轉化成行內塊元素，但是塊與塊之間會留下空隙，很難控制。
如何實現盒子的左右對齊？
使用標準流是很難完成的。
總結：多個塊級元素縱向排列找標準流，多個塊級元素橫向排列找浮動。
float用於建立浮動框，將其移動到一邊，直到左邊緣或右邊緣觸及包含塊或者另乙個浮動框的邊緣。
選擇器
描述none
元素不浮動
left
元素向左浮動
right
元素向右浮動
浮動元素會脫標。
現在有2個div
這個是標準流，如果給第乙個盒子加了float屬性，盒子就會飛起來，就會變成如下模樣。
浮動元素會一行內顯示並且頂部對齊。
如果div1和div2都設定了左浮動，會變成如下模樣：
浮動元素會具有行內塊元素的特性。
浮動盒子只會影響浮動盒子後面的標準流，不會影響前面的標準流。
浮動不會壓住標準流裡面的文字。
之前例子中父盒子的高度是固定的，但是在網頁布局中比如一篇文章長短是不同的，不能把盒子定死。但是盒子浮動不佔位置，最後父級高度為0時，就會影響標準流的盒子。
在清除浮動之後，父級就會根據浮動的子盒子自動檢測高度，父級就會有高度，就不會影響下面的標準流了。
語法：
clear
:both;
style
="clear
:both
">
div>
優點：通俗易懂。
缺點：結構化比較差。
給浮動元素的父元素新增以下屬性：
overflow
:hidden;
**簡潔。
缺點：無法顯示溢位部分。
.clearfix:after
.clearfix:before,.clearfix:after
.clearfix:after
.clearfix
CSS學習筆記 浮動 六
浮動的框可以向左或向右移動，直到它的外邊緣碰到包含框或另乙個浮動框的邊框為止。浮動框浮動後，將脫離原來的普通文件流，並且不會占用空間，層級會高於普通文件流。浮動元素會生成乙個塊級框，而不論它本身是何種元素。浮動元素一般要指定乙個明確的寬度 否則，它們會盡可能地窄。屬性名稱 取值 描述 float l...
CSS布局之浮動 清除浮動
1.2 浮動 float 小結 1.3 浮動 float 的應用 重要 1.4 浮動 float 的擴充套件 2.清除浮動 2.4 清除浮動總結 概念 元素的浮動是指設定了浮動屬性的元素會 脫離標準普通流的控制 移動到指定位置。作用 讓多個盒子 div 水平排列成一行，使得浮動成為布局的重要手段。可...
HTML筆記（六）CSS 浮動 定位
css浮動 1.定義 定義元素框相對於其正常位置應該出現的位置 2.分類 3.浮動定位指 將元素排除在普通流之外 元素將不在頁面中佔據空間 將浮動元素放置在包含框的左邊或者右邊 浮動元素依舊位於包含框之內 浮動的框可以向左或者向右移動，直到他的外邊緣碰到包含框或另乙個浮動框的邊框為止。4 浮動 fl...