清除浮動設置在footer
* {
? ? margin:0;
padding:0;
}
#wrap {
background:#00C;
margin:0 auto;
width:960px;
}
#header {
background:#FF3300;
width:100%;
}
#mainbody {
? ?background:#FC0;
? ?
}
.left {
width:800px;
height:200px;
background:#000;
float:left;
}
.right {
width:140px;
height:500px;
background:#690;
float:right;
}
#footer {
background:#639;
width:100%;
? ? width:100%;
? ? overflow:hidden;
}
</style>
</head>
<body>
<div id="wrap">
? <div id="header">頭部</div>
? <div id="mainbody">
? ? <div class="left"></div>
? ? <div class="right"></div>
? </div>
? <div id="footer">版權部分</div>
把
width:100%;
? ? overflow:hidden;
加在footer樣式,和加在mainbody樣式中為什么會出現不同的效果,清楚樣式是設置在被影響元素的后面嗎,為什么老師設置在mainbody
2017-05-31
浮動是影響與它相關聯的元素上,left和right設置浮動后,被影響的是mainbody,而不是footer,你可以試著把right的“float:right”刪掉,你會發現right部分會排列在left的下一行,說明它并沒有受到left的浮動影響,所以收到right和left浮動影響的是mainbody。
ps:同學你的清除打錯了(括弧笑)