float是css样式中的定位属性，用于设置标签的左右浮动，浮动后的元素不属于html文档流，需要用清除浮动把标签拽回到文档流中。
浮动值有 left：向左浮动和right：向右浮动
因为html文档流是自窗体自上而下分成一行一行，并在每行中按从左到右的顺序排放元素
CSS 清除浮动：清除浮动是在使用了浮动之后必不可少的，为了网站布局的效果，清除浮动也变得非常麻烦。
清除浮动的常用方式：
1.结尾处加空div标签 clear:both（或在下一个元素上加clear:both;clear属性值：left、right、both）
<style>
.d1{width:200px; height:200px; background:red; float: left; }
.d2{width:300px; height:300px; background:blue;float: left;}
.d3{width:500px; height:500px; background:green; clear:both;}
</style>
<body>
<div class="d1"></div>
<div class="d2"></div>
<div class="d3"></div>
</body>2.父级div定义 伪元素:after和 zoom
3.父级div定义 overflow:hidden
<style>
.d1{width:200px; height:200px; background:red; float: left; }
.d2{width:300px; height:300px; background:blue;float: left;}
.d{width:500px; height:500px; background:green; overflow: hidden;}
</style>
<body>
<div class="d">
<div class="d1"></div>
<div class="d2"></div>
</div>
</body>
浮动的元素脱离文档流后，对块元素而言，从上向下的文档流中找不到浮动的元素，所以在浮动元素后加块元素，块元素会被覆盖掉。
浮动的元素脱离文档流后，这个浮动的块元素虽然脱离了文档流，但对它后面的行元素而言，从左至右的位置中，是要以这个浮动元素的位置开始的。
clear:both; 的应注意：
1.加了clear:both的元素需要为块元素。这样clear:both才能清除块“从上而下”的文档流中被浮动的元素。
clear:both只是清除它之上的浮动元素，如果用在行内元素上，实际上是基于一行，所以不起作用。
2.不要加在外层的div外面，如果这个外层div没有浮动，那这个clear:both是不起作用的。
200
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
