<div class="top">top</div>
<div class="main">
<div class="right">right</div>
<div class="left">left</div>
<div class="clear"></div>
</div>
<div class="foot">foot</div>
<div class="main">
<div class="right">right</div>
<div class="left">left</div>
<div class="clear"></div>
</div>
<div class="foot">foot</div>
.top{width:100%;height:70px;background-color:#ccc;}
.main{width:100%;background-color:red;}
.left{width:35%;height:350px;background-color:blue;float:left;}
.right{width:63%;height:350px;background-color:green;float:right;}
.foot{width:100%;height:50px;background-color:orange;}
.clear{clear:both;}
.main{width:100%;background-color:red;}
.left{width:35%;height:350px;background-color:blue;float:left;}
.right{width:63%;height:350px;background-color:green;float:right;}
.foot{width:100%;height:50px;background-color:orange;}
.clear{clear:both;}
已采纳回答 / joyboy0405
根据自身情况采取相应的记录手段吧,不回顾很容易忘的,我是手记的,记的时候又加强了记忆,之后也可以拿来回顾,记重点,但也不能太心急,该慢还是要慢的。希望能够对你有多帮助~
2016-08-29
已采纳回答 / tang90
因为middle是在标准文档流中,所以middle块级元素占一行,后面的div只能从下面开始了。我猜测应该是这个原因。把middle改成相对或者绝对定位,使它脱离标准文档流应该可以。
2016-08-28
.top{width:100%; height:100px; background:gray;}
.main{width:100%; height:600px; background:red;}
.left{width:300px; height:600px; background:blue; float:left;}
.right{width:550px; height:600px; background:#369; float:right;}
.foot{width:100%; height:100px; background:#f63;}
.main{width:100%; height:600px; background:red;}
.left{width:300px; height:600px; background:blue; float:left;}
.right{width:550px; height:600px; background:#369; float:right;}
.foot{width:100%; height:100px; background:#f63;}
.top{width:800px;height:100px;background:#ccc;}
.main{width:800px;height:600px;background:red;}
.left{width:200px;height:600px;background:blue;float:left;}
.right{width:590px;height:600px;background:#9c9;float:right;}
.foot{width:800px;height:50px;background:#f63;clear:both;}
.main{width:800px;height:600px;background:red;}
.left{width:200px;height:600px;background:blue;float:left;}
.right{width:590px;height:600px;background:#9c9;float:right;}
.foot{width:800px;height:50px;background:#f63;clear:both;}