浮动

标准流：HTML元素默认的排列的规则。

浮动流：给元素添加float属性后，将元素从标准流中脱离出来。在标准流上新建一个层，在该层上所有元素都在一行显示。

浮动：给元素加float属性。给元素加float属性后，会使元素从标准流中脱离，在浮动流中按照新的规则进行排列。

浮动的影响：

从位置角度考虑：

1、标准流中的文本，会对浮动元素形成环绕效果

2、两个上下关系的元素，如果都没设置浮动，二者之间上下的margin值为较大值。设置浮动后，为二者之和。

3.浮动的元素会先判断HTML结构中，前面标签的类型。如果是块级元素，且未设置浮动，则在浮动时，浮动元素会在块元素下方浮动。

4.元素向右浮动时，元素的显示顺序为逆序。

从元素角度考虑：

5.一切都 变为块元素

6.如果没设置宽度，则浮动后元素的宽度为最小宽度

7.浮动时，空间不够时，自动换行

8.浮动后，标准流中的原有位置丢失。

浮动所带来的问题：

如果父元素没有设置高度，父元素会塌陷。

解决方案：1给父元素设置高度

2.给父元素添加overflow:hidden

3.给父元素后面的兄弟元素添加clear属性

4.给父元素设置一个类名，添加该类样式：

.clearFloat:after{

content:"";

display:block;

clear:both;

}