<div class="box1_1"><span>块3</span></div>
</div> 3.浮动“塌陷”
·使用浮动(float)的一个比较疑惑的事情是他们怎么影响包含他们的父元素的。如果父元素只包含浮动元素，且父元素未设置高度和宽度的时候。那么它的高度就会塌缩为零。如果父元素不包含任何的可见背景，这个问题会很难被注意到，但是这是一个很重要的问题。在这里我们可以称为“塌陷”。如下图
代码：
<div class="box3">
<div class="box1_1 fl"><span>块1</span> float:left</div>
<div class="box1_1 fl"><span>块2</span> float:left</div>
<div class="box1_1 fl"><span>块3</span> float:left</div>
</div> 解决“塌陷”问题有以下三个方法
1.在使用float元素的父元素结束前加一个高为0宽为0且有clear:both样式的div 如下图
代码：
<div class="box1">
<div class="box1_1 fl"><span>块1</span> float:left </div>
<div class="box1_1 fl"><span>块2</span> float:left</div>
<div class="box1_1 fl"><span>块3</span> float:left</div>
<div class="clear"></div>
</div> 2.在使用float元素的父元素添加overflow:hidden;如下图
代码：
<div class="box1 hidden">
<div class="box1_1 fl"><span>块1</span> float:left </div>
<div class="box1_1 fl"><span>块2</span> float:left</div>
