1.原來在一行中的兩個塊，會因為瀏覽器視窗的大小改變而改變其原來的位置（變成多行），瀏覽器視窗寬度不夠容納
解決方法：加個父div,並且設定寬度
.father 左右
2.清除浮動clear
當元素有浮動屬性時，會對其父元素或後面的元素產生影響，出現乙個布局錯亂的現象。
none:預設值。允許兩邊有浮動物件
left：不允許左邊有浮動物件
right：不允許左邊有浮動物件
both：左右兩側不允許有浮動物件
當父元素沒有指定高度時，並且它的子元素有浮動，這時這個父元素的高度不會自適應
(1)額外標籤法（末尾加個空盒子）
w3c建議在容器的末尾增加乙個「clear:both」的元素，強迫容器適應它的高度以便裝下所有的float元素
.father 左右
增加乙個空div
(2)溢位的使用(overflow)
給父盒子加個overflow:hidden屬性，最簡單的清除浮動方法，如果子元素使用了定位布局，超出的內容看不到
(3)絕對定位和相對定位
position:absolute;relative;fixed(固定在頁面某個位置)
絕對定位：將物件從文件流中分離出來，通過設定left,right,top,bottom四個方向相對於父級物件進行絕對定位。如果不存在這樣的父物件，則依據body物件
相對定位與絕對定位
絕對定位是父元素為基準點，進行定位---會脫離文件流
相對定位是根據其自身為基準點，進行定位---離開原位置，但還佔著原來空間
當我們想要使用絕對定位時：必須要有兩個條件
1.必須給父元素加定位屬性，一般建議使用position:relative;
2.給子元素加絕對定位position:absolute;同時要加方向屬性
#main ｛
width:700px;
margin:0 auto;
background:pink;
overflow:hidden;
position:relative;
｝#left ｛
width:200px;
height:200px;
background:red;
position:absolute;
top:100px;
left:-100px;
｝(4)偽物件after清除浮動，網上最流行(相當於在父盒子尾部加個隱藏的div）
.clearfix:after左右
增加乙個空div
cursor:pointer;
本文出自 「點滴積累」 部落格，請務必保留此出處
css 清除浮動與定位
一 清空浮動的方法 box1 box 1 1 box 2 2 1.在最後乙個浮動的元素後新增乙個空標籤，並設定樣式 clear both box1 box 1 1 box 2 2 clear both 小結 優點 寫法簡單 缺點 新增了無意義的標籤2.給浮動元素的父元素新增樣式 overflow h...
清除浮動和定位
清除浮動 1 怪異盒子模型 div的高度和寬度 原來的高度和寬度 box sizing border box div的高度和寬度 padding border content box sizing content box 2 浮動 定義 div浮動後，脫離文件流不再獨佔一行，後續內容會被擠到原來的位...
css浮動和清除浮動
css樣式的float浮動屬性，用於設定標籤物件 如 標籤盒子 標籤 標籤 標籤等html標籤 的浮動布局，浮動也就是我們所說標籤物件浮動居左靠左 float left 和浮動居右靠右 float right 一般情況是乙個盒子裡使用了css float浮動屬性，導致父級物件盒子不能被撐開，這樣cs...