Css浮動(dòng)元素外層容器高度為0(無高度)的解決方法
發(fā)布時(shí)間：2013-07-31 11:40:11 作者：佚名 
我要評(píng)論
我要評(píng)論在ie8、chrome瀏覽器中，包裹浮動(dòng)的li元素的外層ul高度為0，ie7瀏覽器和ie8兼容模式顯示正常，下面與大家分享下多種解決方法大家可以根據(jù)情況自由選擇，希望對(duì)大家有所幫助
由于項(xiàng)目中使用ul+li的布局方式，在ie8、chrome瀏覽器中，包裹浮動(dòng)的li元素的外層ul高度為0，ie7瀏覽器和ie8兼容模式顯示正常，這是典型的瀏覽器兼容性問題。
解決辦法：
第一種：設(shè)置ul的style屬性
overflow:hidden;//超出元素緯度范圍的內(nèi)容的可見性：隱藏
第二種：設(shè)置ul的style屬性
float:left; //浮動(dòng)：左
第三種：在ul標(biāo)記內(nèi)加空div
<div style=" clear:both; visibility:hidden;">
解決辦法：
第一種：設(shè)置ul的style屬性
復(fù)制代碼
代碼如下:overflow:hidden;//超出元素緯度范圍的內(nèi)容的可見性：隱藏
第二種：設(shè)置ul的style屬性
復(fù)制代碼
代碼如下:float:left; //浮動(dòng)：左
第三種：在ul標(biāo)記內(nèi)加空div
復(fù)制代碼
代碼如下:<div style=" clear:both; visibility:hidden;">
相關(guān)文章
- 當(dāng)一個(gè)元素只包含浮動(dòng)元素的時(shí)候，它會(huì)出現(xiàn)高度折疊，即元素的上下底邊重合，和高度為0效果一樣，針對(duì)這個(gè)問題與大家分享四種解決方法，感興趣的你可以參考下本文或許對(duì)你2013-03-04
解決子容器全部浮動(dòng)時(shí)父容器高度不能自動(dòng)撐開的方法
剛?cè)腴T網(wǎng)站設(shè)計(jì)布局的開發(fā)者肯定會(huì)碰到這樣的問題，那就是當(dāng)子容器全部浮動(dòng)的時(shí)候，父容器的高度不能自動(dòng)撐開,今天偶也遇此問題，需要了解的朋友可以參考下2012-12-27純CSS無hacks的跨游覽器自適應(yīng)高度多列布局 推薦
翻譯自Matthew James Taylor的Equal Height Columns with Cross-Browser CSS and No Hacks，有些部分根據(jù)我的理解改了，讓一些初心者更好理解。2009-11-12- 由于浮動(dòng)的元素脫離了文檔流，所以它們不會(huì)在網(wǎng)頁(yè)文檔中占據(jù)空間。如果一個(gè)DIV容器中想要包含這些浮動(dòng)的元素的話，有兩種辦法。2011-08-02
CSS教程：div設(shè)置float后高度不自動(dòng)增加-CSS教程-網(wǎng)頁(yè)制作-網(wǎng)頁(yè)教學(xué)網(wǎng)
相關(guān)文章：http://www.webjx.com/css/divcss-4952.html http://www.webjx.com/css/divcss-5991.html 本來想把這個(gè)題目修改為“閉合浮動(dòng)元素”或&l2008-10-17- 在進(jìn)行浮動(dòng)布局時(shí)，大多數(shù)人都深知，在必要的地方進(jìn)行浮動(dòng)清理：。2009-09-03
浮動(dòng)層自動(dòng)適應(yīng)高度的解決方法
在網(wǎng)頁(yè)制作中經(jīng)常會(huì)用到浮動(dòng)。用了浮動(dòng)就會(huì)涉及到一個(gè)清除浮動(dòng)的問題，因?yàn)榘?dòng)的元素是不會(huì)自動(dòng)適應(yīng)高度的，也就是不會(huì)被浮動(dòng)元素?fù)伍_。2010-07-23