1 <!DOCTYPE html>
2 <html>
3 <head>
4 <meta charset="utf-8">
5 <title></title>
6 <style>
7 .box{
8 border: 1px solid red;
9 overflow: hidden;<!--
相当于子太大父亲包不住，overflow：scroll是滚动条--> }
11 .item{
12 width: 200px;
13 height: 200px;
14 background-color: black;
15 float: left;
16 }
17 </style>
18 <!--
19 清除浮动的方法
20 1、加高度 (扩展性不好)
21 2、给父级加浮动 (页面中所有元素都加浮动，margin左右自动失效（floats bad ！）)
22 3、.inline-block 清浮动方法 (margin左右auto失效)
23 4、空标签清除浮动 (IE6 最小高度 19px；（解决后IE6下还有2px偏差）)
24 5、.br清浮动 (不符合工作中：结构、样式、行为，三者分离的要求)
25
26 -->
27 </head>
28 <body>
29 <div class="box">
30 <div class="item"></div>
31 </div>
32 </body>
33 </html>