宣告：本人的所有部落格皆為個人筆記，作為個人知識索引使用，因此在敘述上存在邏輯不通順、跨度大等問題，希望理解。分享出來僅供大家學習翻閱，若有錯誤希望指出，感謝！
網頁布局的核心——就是用 css 來擺放盒子
css 提供了來設定盒子的擺放位置，分別是（標準流）、和，其中：
普通流（標準流）
行內元素會按照順序，順序排列，碰到父元素邊緣則自動換行；
浮動
定位
概念：元素的浮動是指設定了浮動屬性的元素會
作用：
語法：
選擇器
描述none
元素不浮動（預設值）
left
元素向左浮動
right
元素向右浮動
ps:
浮動和標準流的父盒子搭配浮動元素與父盒子的關係
浮動元素與兄弟盒子的關係
在乙個父級盒子中，如果前乙個兄弟盒子是：
ps：
父級盒子很多情況下，不方便給高度，因為父盒子會自動檢測子盒子的高度以適應子盒子，但是子盒子浮動就不占有位置，最後父級盒子高度為0，就影響了下面的標準流盒子。
清除浮動的方法
在css中，clear屬性用於清除浮動
選擇器 //clear 清除描述left
不允許左側有浮動元素（清除左側浮動的影響）
right
不允許右側有浮動元素（清除右側浮動的影響）
both
同時清除左右兩側浮動的影響
但是我們實際工作中， 幾乎只用 clear: both;
1.額外標籤法(隔牆法)
通過在浮動元素末尾新增乙個空的標籤例如 style
=」clear:both」
>
div>
，或則其他標籤br等亦可
可以給父級新增： overflow為 hidden| auto| scroll 都可以實現。.clearfix:after
.clearfix
/* ie6、7 專有 */
使用方法：
.clearfix:before,.clearfix:after
.clearfix:after
.clearfix
CSS中，float浮動的理解
浮動什麼意思呢，比如，預設的，我們知道，div是佔滿一行的，現在我們想把兩個div顯示在一行上，那怎麼辦呢 11111 2222 這樣我們就設定了兩個div，乙個寬度100px,乙個寬150px,可預覽一下，我們的div仍在兩行上，那麼怎麼把它改到一行上呢，這兒就需要float，設定第乙個div的f...
css中的浮動元素float
浮動屬性作為css的重要屬性，被頻繁地應用在網頁製作中。所謂元素的浮動時指設定了浮動屬性的元素會脫離標準文件流的控制，移動到其父元素中相應位置的過程，float屬性的基本語法格式是 選擇器left 元素向左浮動 right 元素向右浮動 nons 元素不浮動，預設值 使用clear屬性清除浮動 使用...
CSS中浮動與清除float浮動
浮動語法 float none left right float 定義網頁中其它文字如何環繞該元素顯示 浮動的目的 就是讓豎著的東西橫著來 橫向排列元素 有三個取值 left 元素活動浮動在文字左面 right 元素浮動在右面 none 預設值，不浮動。清除浮動clear left right bo...