高度的自適應(yīng)（父div高度隨子div的高度改變而改變）

1、如果父div不定義height、子div均為標(biāo)準(zhǔn)流的時候，父div的height隨內(nèi)容的變化而變化,實(shí)現(xiàn)父div高度隨子div的高度改變而改變。


<style type="text/css">
?
?????#aa{}{ border:#000000 solid 5px}
?
?????#bb{}{border:#00ffff solid 5px;}
?
?????#cc{}{ border:#0033CC solid 5px}
?
</style>
?
<div id="aa">父div
?
?????<div id="bb">子div</div>
?
?????<div id="cc">子div</div>
?
</div>


2、如果子div使用了float屬性，此時已經(jīng)脫離標(biāo)準(zhǔn)流，父div不會隨內(nèi)容的高度變化而變化，解決的辦法是在浮動的div下面，加一個空div，設(shè)置clear屬性both


??<style type="text/css">

?
????#aa{}{ border:#000000 solid 5px;}
?
????#bb{}{border:#00ffff solid 5px;float:left}
?
????#cc{}{ border:#0033CC solid 5px;float:left}
?
</style>
?
<div id="aa">父div
?
????<div id="bb">子div</div>
?
????<div id="cc">子div</div>
?
???<div style="clear:both"></div>
?
</div>


參考資料： css中div高度自適應(yīng) http://www.studyofnet.com/news/143.html

總結(jié)

以上是生活随笔為你收集整理的css中div高度自适应的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。