為元素設定了浮動之後，元素就會脫離文件流(可以看做是漂浮在文件流之上)存在。所有產生了浮動流的元素，塊級元素看不到它們。產生了bfc的元素和文字類屬性(inline)的元素以及文字都能看到浮動元素。
如何觸發乙個盒子的bfc？
position: absolute;
float: left/right
display: inline-block;
overflow: hidden;
在浮動元素末尾新增乙個空元素，如： 2
3 這樣操作的壞處就是實際操作太麻煩，改變了原有的頁面結構，維護起來不方便
使用偽元素(推薦使用)
content: "";
display: block;
clear: both;}
使父元素變成bfc元素
為父元素設定
position: absolute;
float: left/right
display: inline-block;
overflow: hidden;
四、浮動的應用
為設定浮動，可以實現字型環繞的樣式。
可以實現導航
九宮格
浮動與清除浮動
left 元素向左浮動。right 元素向右浮動。none 預設值。元素不浮動，並會顯示在其在文字中出現的位置。浮動的特性 浮動元素會從普通文件流中脫離，但浮動元素影響的不僅是自己，它會影響周圍的元素對齊進行環繞。不管乙個元素是行內元素還是塊級元素，如果被設定了浮動，那浮動元素會生成乙個塊級框，可以...
浮動與清除浮動
浮動布局是一種常見的布局方式，最初的使用目的是進行 的混排 清除浮動 浮動的使用場景 浮動通過css定義 div1 浮動可以取的值 none 預設 left right 當元素進行左浮動或者右浮動之後會脫離文件流，並且構成乙個浮動流，會覆蓋在沒有浮動的元素上，並且允許文字和內聯元素環繞在它周圍 浮動...
浮動與清除浮動
浮動與清除浮動 也成了建立多欄布局最簡單的方式。文字內容段落內容文字內容段落內容文字內容段落內容文字內容段落內容文字內容段落內容 文字繞排 p img 建立多欄布局 p img 二 浮動元素脫離了文件流，其父元素也看不到他了，因為也不會包圍他，就會出現子元素有高度，而父元素不會被撐起，這時候並非我們...