好久没写博客了，最近捡起前端代码开始码，一些基本的东西都忘记了，觉得自己停滞不前的原因就是没做好巩固——废话
我们常常在做盒子嵌套的时候，最外层盒子不想给他设置高度，因为我们填充的内容不确定有多大，一般就选择auto自适应。
然，子级盒子又是一个嵌套或者样式复杂点，超出父级盒子的边界外边，在央视里面调来调去调不好，试过修改display属性、又再嵌套盒子，都不是很理想，最后找了一圈（强大的百度）发现问题所在了，这个是由于浮动产生原因。
初始代码如下：
1
2
3
4
5
21
22
23
24
div_l
25
div_r
26
27
28
效果图如上，按照代码中div的需要，给父级div设置height=200px即可，若子级div数据较多，或者从后台调取数据进行添加时，设置的高度又不适用了。
代码如下：
1
2
3
4
5
18
19
20
21
div_1
22
div_2
23
div_3
24
div_4
25
26
27
效果图如下：
方法一：对父级加 overflow 样式
代码如下：
1
2
3
4
5
19
20
21
22
div_1
23
div_2
24
div_3
25
div_4
26
27
28
效果如下：
治标不治本，我要的是自适应高度，要都显示。
方法二：对子级使用 clear 清除浮动
插入一个空的div盒子，用来做清除浮动，代码如下：
1
2
3
4
5
20
21
22
23
div_1
24
div_2
25
div_3
26
27
28
29
OK了，效果如下：