<div class="mainBox">
<div class="leftBox"></div>
<div class="rightBox"></div>
<div class="clear"></div>
</div>
注意：leftBox和rightBox設(shè)置浮動(dòng)之后脫離了普通的文檔流，不再占用原來(lái)文檔中的位置，
因此無(wú)法把父div撐開(kāi)。
解決的方法：
①可以給父div也設(shè)置高度為300px，使頁(yè)面中的leftBox和rightBox看起來(lái)"好像"還在原來(lái)的位置；
②定義一個(gè)類(lèi)選擇器，并設(shè)置clear:both；清除浮動(dòng)，同時(shí)為了解決IE6中div
有高度的問(wèn)題可以增加屬性height:0;overflow:hidden;
.mainBox
{
width:960px;
margin:0 auto;
background-color:#CFF;
overflow:visible;
}
.leftBox
{
width:740px;
height:300px;
background-color:#C9F;
float:left;
}
.rightBox
{
width:210px;
height:300px;
background-color:#FCF;
float:right;
}
.clear
{
clear:both;
height:0;/*解決IE6下有高度的問(wèn)題*/
overflow:hidden;
}
/*父元素不設(shè)置高度，子元素是有高度的，會(huì)把父元素?fù)伍_(kāi)*/ /*如果子元素設(shè)置浮動(dòng)的話，就脫離了文檔流，就不會(huì)把父元素?fù)伍_(kāi)了*/ /*因此，子元素設(shè)置浮動(dòng)，父元素需要設(shè)置高度*/
【 微信掃一掃 】
