css樣式 float clear 詳解

轉載

CSS中的float屬性是一個頻繁用到的屬性，對於初學者來說，如果沒有理解好浮動的意義和表現出來的特性，在使用的使用很容易陷入困惑，雲裡霧裡，搞不清楚狀態。本文將從最基本的知識開始說起，談談關於浮動的應用，出現的問題和解決方案。 基礎知識

float，顧名思義就是浮動，設定了float屬性的元素會根據屬性值向左或向右浮動，我們稱設定了float屬性的元素為浮動元素。
浮動元素會從普通文檔流中脫離，但浮動元素影響的不僅是自己，它會影響周圍的元素對齊進行環繞。舉例說明如下：
Html代碼： XHTML

1 2 3 4 5 6

<div class = "box" >          <span class = "float-ele" >             浮動元素          </span>         普通文檔流普通文檔流普通文檔流普通文檔流普通文檔流普通文檔流普通文檔流普通文檔流普通文檔流普通文檔流普通文檔流普通文檔流普通文檔流普通文檔流普通文檔流 </div>

CSS代碼： CSS

1 2	.box { background :