浮动产生原因:
一般浮动是什么情况呢？一般是一个盒子里使用了CSS float浮动属性，导致父级对象盒子不能被撑开，这样CSSfloat浮动就产生了。
例如：有三个div，两个div嵌套在一个大的div中，应用浮动。html如下：
<div>
<div class="div2"></div>
<div class="div3"></div>
</div>
css如下：
.div1{border: 1px solid red;}
.div2{width: 100px;height: 30px;border: 1px solid blue;float: left;}
.div3{width: 100px;height: 30px;border: 1px solid blue;float: left;}
好，本来我们想要的效果是下面的两个div将上面的div撑开，但是实际效果却是：
下面的两个div使用了float属性脱离了普通文档流，浮于文档流之上了。
那么我们现在需要的是清除浮动，使外围的div被撑起来
解决办法：
1、在最外围的div设置能够放下两个div的高度
2、一般我们采用的是clear：both的做法，但是这里我们会多加上div的标签，代码变多了。
网友评论