clear:both是清除什么浮动,footer又没有浮动起来
混合布局
body{ margin:0; padding:0; font-size:30px; font-weight:bold}
div{ text-align:center; line-height:50px}
.top{ height:100px;background:#9CF}
.head,.main{ width:960px; margin:0 auto;}
.head{ height:100px; background:#F90}
.left{ width:220px; height:600px; background:#ccc; 【任务2】}
.right{ width:740px; height:600px;background:#FCC; float:right}
.r_sub_left{ width:540px; height:600px; background:#9C3; float:left}
.r_sub_right{ width:200px; height:600px; background:#9FC; 【任务3】}
.footer{ height:50px; background:#9F9; 【任务4】}
head
left
sub_left
sub_right
footer |
免责声明:本内容仅代表回答会员见解不代表天盟观点,请谨慎对待。
版权声明:作者保留权利,不代表天盟立场。
|
|
|
|
任务2 : float: left;
任务3 :float: left;
任务4 :clear: both;
footer是没有浮动,清除浮动实际上是清除浮动对它的影响。
浮动元素默认是不占空间的,上面的left right 都浮动起来了,
这个时候下面的footer就会挤到上面浮动元素的底下,
那么clear:both 就是清除上面元素浮动对他的影响,让它自己呆在标准流的位置。 |
|
|
|
|