浮动
所谓浮动指的是使元素脱离原来的文本流，在父元素中浮动起来
浮动使用float属性
可选值：none：不浮动；left：向左浮动；right：向右浮动
块级元素和行内元素都可以浮动，当一个行内元素浮动以后将会自动变为一 个块级元素
当一个块级元素浮动以后，宽度会默认被内容撑开，所以当漂浮一个块级元素时我们都会为其指定一个宽度
当一个元素浮动以后，其下方的元素会上移，元素中的内容将会围绕在元素的周围
浮动会使元素完全脱离文本流，也就是不再在文档中在占用位置
元素设置浮动以后，会一直向上漂浮直到遇到父元素的边界或者其他浮动元素
元素浮动以后即完全脱离文档流，这时不会再影响父元素的高度，也就是浮动元素不会撑开父元素
浮动元素默认会变为块元素，即使设置display:inline以后其依然是个块元素
浮动特性
浮动元素有左浮动(float:left)和右浮动(float:right)两种
浮动的元素会向左或向右浮动，碰到父元素边界、浮动元素、未浮动的元素才停下来
相邻浮动的块元素可以并在一行，超出父级宽度就换行
浮动让行内元素或块元素自动转化为行内块元素
浮动元素后面没有浮动的元素会占据浮动元素的位置，没有浮动的元素内的文字会避开浮动的元素，形成文字饶图的效果
父元素内整体浮动的元素无法撑开父元素，需要清除浮动
浮动元素之间没有垂直margin的合并
清除浮动
clear属性可以用于清除元素周围的浮动对元素的影响。
也就是元素不会因为上方出现了浮动元素而改变位置。
可选值：
left：忽略左侧浮动
right：忽略右侧浮动
both：忽略全部浮动
none：不忽略浮动，默认值
方法：
1.父级上增加属性overflow：hidden
2.在最后一个子元素的后面加一个空的div，给它样式属性 clear:both（不推荐）
3.使用成熟的清浮动样式类，clearfix
.clearfix:after,.clearfix:before{ content: "";display: table;}
.clearfix:after{ clear:both;}
.clearfix{zoom:1;}
清除浮动的使用方法：
.con2{... overflow:hidden}
或者
<div class="con2 clearfix">
