1 <!DOCTYPE html>
2 <html>
3 <head>
4 <meta charset="utf-8">
5 <title></title>
6 <style>
7 .box{
8 width: 400px;
9 border: 1px solid black;
10 overflow:hidden; <主盒子要消除浮动给否则包不住里面的内荣>
11 }
12 .let{
13 float: left;
14 background-color: red;
15 }
16 .right{
17 float: right;
18 background-color: blue;
19 }
20 h2{
21 float: left; <要使得h2不盛满一行就得给h2加一个浮动>
22 margin: 0;
23 height: 30px;
24 }
25 </style>
26 <!--
27 解决方案：float: left;
28 -->
29 </head>
30 <body>
31 <div class="box">
32 <div class="let">
33 <h2>左边</h2>
34
35 </div>
36 <div class="right">
37 <h2>右边</h2>
38 </div>
39
40 </div>
41 </body>
42 </html>
