css別忘記清除浮動(dòng)clear:both
更新時(shí)間：2008年03月30日 12:44:34 作者：
總結(jié)下清除浮動(dòng)的一般解決方案,做網(wǎng)頁(yè)時(shí)要注意
用空標(biāo)簽清除
.clr {clear: both;}
<div id="layout">
<div id="left">Left</div>
<div id="right">Right</div>
<p class="clr"></p>
</div>
使用 overflow 屬性
#layout {overflow:auto; zoom:1;}
<div id="layout">
<div id="left">Left</div>
<div id="right">Right</div>
</div>
使用 :after （非 IE 瀏覽器）
#layout:after{
display: block;
clear: both; content: "";
visibility:hidden; height: 0;
}
<div id="layout">
<div id="left">Left</div>
<div id="right">Right</div>
</div>注：使用 :after 需要注意幾點(diǎn)，設(shè)置高度為零（height: 0;）；content 是必須的，但其值可以為空
.clr {clear: both;}
<div id="layout">
<div id="left">Left</div>
<div id="right">Right</div>
<p class="clr"></p>
</div>
使用 overflow 屬性
#layout {overflow:auto; zoom:1;}
<div id="layout">
<div id="left">Left</div>
<div id="right">Right</div>
</div>
使用 :after （非 IE 瀏覽器）
#layout:after{
display: block;
clear: both; content: "";
visibility:hidden; height: 0;
}
<div id="layout">
<div id="left">Left</div>
<div id="right">Right</div>
</div>注：使用 :after 需要注意幾點(diǎn)，設(shè)置高度為零（height: 0;）；content 是必須的，但其值可以為空
相關(guān)文章
區(qū)分IE6，IE7，firefox的CSS hack
經(jīng)常網(wǎng)頁(yè)布局需要兼職多瀏覽器，所以下面的css hack可以用，但最好少用，不得不用才用2008-04-04
在解決ul居中問題時(shí)想到的幾點(diǎn)...2007-09-09
Div CSS absolute與relative的區(qū)別小結(jié)
Div + CSS 進(jìn)行網(wǎng)頁(yè)布局，適當(dāng)?shù)剡\(yùn)用 absolute 與 relative，能給布局帶來(lái)意想不到的效果和方便，達(dá)到事半功倍…本文介紹了關(guān)于 absolute 與 relative 的運(yùn)用。2007-12-12
[紅色]從gb到utf-8...2006-12-12
CSS規(guī)則層疊的應(yīng)用 css必須要注意的幾點(diǎn)
前幾天，我解釋了 CSS規(guī)則層疊時(shí)的算法 雖然看起來(lái)復(fù)雜，但是在實(shí)際應(yīng)用過(guò)程中，還不算太復(fù)雜，因?yàn)橹T如user style和inline style之類的東西我們很少考慮。2008-04-04
做網(wǎng)頁(yè)中需要掌握的八個(gè)CSS布局技巧
做網(wǎng)頁(yè)中需要掌握的八個(gè)CSS布局技巧...2007-06-06
一些很不錯(cuò)的css技巧,但也常為人們所忽略...2007-05-05
網(wǎng)頁(yè)設(shè)計(jì)者需要了解的_網(wǎng)頁(yè)字體大小數(shù)據(jù)參考
對(duì)于頁(yè)面來(lái)說(shuō)，字體的大小設(shè)置是比較重要的，網(wǎng)上搜集了一些關(guān)于網(wǎng)頁(yè)中字體大小的數(shù)據(jù)對(duì)比，在這共享出來(lái)給大家一起看看，希望對(duì)大家在頁(yè)面制作過(guò)程中有所幫助！2008-10-10
div+css實(shí)現(xiàn)自適應(yīng)寬度按鈕
div+css實(shí)現(xiàn)自適應(yīng)寬度按鈕...2007-11-11
CSS制造：鼠標(biāo)移上去顯示大圖...2006-12-12