一個(gè)老外弄的Clearing floats(清除浮動(dòng)的方法)
更新時(shí)間:2007年09月10日 22:16:46 作者:
我常用的都是clear:both;方法,如
<div style="clear:both">
<div style="float:left"></div>
<div style="float:right"></div>
</div>
今在PlanABC看到另外這種方法,特些記錄下來(lái)。
div.container {
border: 1px solid #000000;
}
div.left {
width: 45%;
float: left;
}
div.right {
width: 45%;
float: right;
}
層套關(guān)系:container的div包含left和right
最簡(jiǎn)單合理的清除浮動(dòng)的方法(紅色粗體部分):
div.container {
border: 1px solid #000000;
overflow: hidden;
width: 100%;
}
兼容情況:IE6 IE7 FF MacIE等
來(lái)源地址:http://www.quirksmode.org/css/clearing.html
PS:不過(guò)在使用的過(guò)程貌似還有小的BUG,淘寶的小馬曾碰到過(guò),具體的癥狀是,IE6中層套清除浮動(dòng)的div,導(dǎo)致部分鏈接無(wú)法點(diǎn)擊。
<div style="clear:both">
<div style="float:left"></div>
<div style="float:right"></div>
</div>
今在PlanABC看到另外這種方法,特些記錄下來(lái)。
div.container {
border: 1px solid #000000;
}
div.left {
width: 45%;
float: left;
}
div.right {
width: 45%;
float: right;
}
層套關(guān)系:container的div包含left和right
最簡(jiǎn)單合理的清除浮動(dòng)的方法(紅色粗體部分):
div.container {
border: 1px solid #000000;
overflow: hidden;
width: 100%;
}
兼容情況:IE6 IE7 FF MacIE等
來(lái)源地址:http://www.quirksmode.org/css/clearing.html
PS:不過(guò)在使用的過(guò)程貌似還有小的BUG,淘寶的小馬曾碰到過(guò),具體的癥狀是,IE6中層套清除浮動(dòng)的div,導(dǎo)致部分鏈接無(wú)法點(diǎn)擊。
相關(guān)文章
css 兼容性問(wèn)題this.style.cursor=''''hand''''
css 兼容性問(wèn)題this.style.cursor='hand'讓我們來(lái)CSS HACK2008-11-11為了防止亂碼,請(qǐng)將用于頁(yè)面編碼的meta charset放到title的前面
為了防止亂碼,請(qǐng)將用于頁(yè)面編碼的meta charset放到title的前面...2007-12-12網(wǎng)頁(yè)綠色系配色應(yīng)用實(shí)例圖文
綠色在黃色和藍(lán)色(冷暖)之間,屬于較中庸的顏色,這樣使得綠色的性格最為平和、安穩(wěn)、大度、寬容。是一種柔順、恬靜、滿足、優(yōu)美、受歡迎之色。也是網(wǎng)頁(yè)中使用最為廣泛的顏色之一。2008-08-08用css來(lái)控制圖片大小顯示的實(shí)現(xiàn)方法與代碼
用css來(lái)控制圖片大小顯示的實(shí)現(xiàn)方法與代碼...2007-03-03創(chuàng)建IE各版本專(zhuān)屬CSS IE中的if語(yǔ)句
創(chuàng)建IE各版本專(zhuān)屬CSS IE中的if語(yǔ)句...2007-09-09