CSS编辑元素的浮动
1.元素浮动：
1）使用 float:left; 这样的格式设置元素的浮动方式，属性值可以是left,right；
2）元素设置为左浮动时，元素将从原区域浮动到浏览器的左侧页面；右浮动时，就会附在右侧的区域，而且元素是按照第一个元素在右侧的第一个位置，依次往左排列；
3）设置了浮动后，该元素相当于直接脱离元素的原来放置层，漂浮在该层之上，该元素位置下方的元素将占用该元素的位置。
2.浮动的作用：
1）子级浮动导致父级元素的高度塌陷；
解决办法：
1 ul{ 2 /*重新设置高度*/ 3 padding:10px; 4 /*触发BFC*/ 5 overflow:hidden; 6 }
2）浮动具有包裹性（浮动之后只包含内容区域）；
1 <p> 2 显示内容 3 </p> 4 5 p{ 6 background-color:red; 7 float:left; 8 }
执行以上代码后，只会在“显示内容”四个字的地方将背景色渲染成红色。
3）行内元素设置浮动后改变了display属性，也就可以设置相应的content的width和height值；
1 <a href="#">点一下</a> 2 3 a{ 4 float:left; 5 }
以上代码执行后，可以在审查时看见 a 的width和height均可以设置具体的值，不再是auto。
4）元素浮动不会穿过padding区域，只会在content区域中；
1 <div> 2 <em>内容</em> 3 </div> 4 5 div em{ 6 float:right; 7 }
在网页中可以看见“内容”只是从content原来的左侧区域移动到了右侧。
5）浮动会导致脱离文档流，影响到其他的元素。（如最上面的第三点，大家可以自己用两个div来验证）
