两种清除浮动方法：
1.p{clear:both/left/right;}
适应范围：紧邻的块级元素
<span style="font-size:14px;"><html>
<head>
<style type="text/css">
#style0{
width:300px;
}
#style1{
background:#FF0000;
float:right; /*设置浮动向右*/
}
#style2{
background:#00FF00;
clear:both; /*清除块1对块2的右浮影响*/
}
</style>
</head>
<body>
<div id="style0">
<div id="style1">块1：how are you</div>
<div id="style2">块2：i am fine</div>
</div>
</body>
</html></span>清除前：
清除后：
2、p{width:100%（或设置定宽）;overflow:hidden;}
适应范围：块级元素嵌套块级元素
width设置为100%就是继承父容器的宽度。左右撑满整个容器，为自己清除浮动创建条件。再加溢出隐藏，就可以把包裹浮动的部分去除。
<span style="font-size:14px;">#style0{
background:#000000;
width:300px; /*父级容器不会显示黑色*/
}
#style1{
background:#FF0000;
}
#style2{
background:#00FF00;
float:left; /*设置块二左浮*/
}</span>
<span style="font-size:14px;">#style0{
background:#000000;
width:300px;
overflow:hidden; /*父级容器会显示黑色*/
}</span>
扫一扫
1482
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
