<style> .div1{ 100px; height: 100px; background-color: blue; float: left;/*第一个div漂浮起来了，第二个div顶替了第一个位置*/ } .div2{ 200px; height: 100px; background-color: red; float: left; } .div3{ 100px; height: 200px; background-color: yellow; float: left; } .div4{ 200px; height: 200px; background-color: green; float: left;/*4个一起飘就从左向右横排排着飘 ，使得4个div在同一行*/ } </style> </head> <body> <!--div.div*4 tab加回车快速输入4个div--> <div class="div1"></div> <div class="div2" style="clear: left"></div>/*style="clear: left"清除左边的浮动，相当于换行*/ <div class="div3" style="clear: right"></div> <div class="div4" ></div> </body>