要想解决这个问题，很简单，设3个DIV即可解决问题：
<body>
<div style="height: 200px; width: 200px; background-color: red;float: right;">
我是红色
</div>
<div style="height: 200px; width: 200px;background-color: gray; clear: left; ">
我是灰色
</div>
<div style="height: 200px; width: 200px;background-color: green;float: right;">
我是绿色
</div>
</body>
1、当某个元素变成float:left时，有2个作用：一是这个元素会浮动在前一个元素的左侧(前提是前一个元素是行内元素)；二是此元素变成块内元素，其它元素可以与之在同一行。
2、如果前面一个元素是float:left的，那么后面一个元素将强行被拉到上一行，此时如果不想上去，用clear:left即可，这句话的意思是如果左边有浮动元素，将认为左侧是块状元素，即自己换行。
讲解css非常专业的一个网站：
refurl:http://zh.html.net/tutorials/css/lesson13.php
http://www.w3school.com.cn/cssref/pr_class_float.asp
1098
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
