浮动
浮动就是让元素可以向左或向右移动，直到它的外边距碰到其父级的内边距或者是上一个元素的外边距(这里指的上一个元素不管它有没有设置浮动，都会紧挨着上一个元素）
float属性
left 元素向左浮动
right 元素向右浮动
none 默认值。元素不浮动，并会显示在其文本中出现的位置
浮动的特性
1.浮动元素支持所有的css样式
2.内容撑开宽高
3.多个元素设置浮动，宽度足够的话，会排在一行
4.脱离文档流
5.提升层级半级
也就是说：一个元素设置了浮动属性后，下一个元素就会无视这个元
素的存在，但是下一个元素中的文本内容依然会为这个元素让出位置
使自身的文本内容环绕在设置浮动元素的周围
注意：不管是行级还是块级元素，如果设置了浮动属性，该元素就变
成了具有inline-block属性的元素
父子关系
1）浮动元素不会在其浮动方向上溢出父
级的包含块
也就是说元素左浮动，其左外边距不会
超过父级的左内边距，元素右浮动，其
右外边距不会超过父级的右内边距
2）浮动元素的位置受到同级同向浮动元
素的影响
也就是说同一父级中有多个浮动元素，
后一个元素的位置会受到前一个浮动元
素位置的影响，他们不会相互遮挡，后
一个浮动元素会紧挨着前一个浮动元素
的左外边距进行定位，如果当前空间不
足，则会换行，否则会放置在前一个浮
动元素的下面
浮动影响父层盒子高度
父元素的高度靠子元素撑开，子元素全部浮动后，均脱离文档流，父
元素高度塌陷。
溢出处理
overflow属性
visible 默认值。内容不会被修剪，会呈现在盒子之外
hidden 内容会被修剪，并且其余内容是不可见的
scroll 内容会被修剪，但是浏览器会显示滚动条以便查看其余内容
auto 如果内容被修剪，则浏览器会显示滚动条以便查看其余的内容
overflow 属性的妙用
使用overflow扩展盒子高度，overflow属性会触发浏览器重新计算父
元素盒子高度。
清除浮动
clear属性
left 在左侧不允许浮动元素
right 在右侧不允许浮动元素
both 在左、右两侧不允许浮动元素
none 默认值。允许浮动元素出现在两侧
