1、float布局的步骤

1. 子元素上加上 float:left|right和width
2. 在父元素上添加 .clearfix

.clearfix{
   content:'';
   display:block;
   clear:both;
}

2、关于float的经验

1. 最后一个子元素可以不设置width，可以设置max-width
2. floatbuju，不需要做响应式，因为手机上没有IE，这个布局是专门为IE准备的
3. IE 6/7存在bug，margin-left的数值会变成双倍，解决办法有两个：
   • 在margin:10px 后面加一句 _margin-left:5px;
   • 加一个display:inline-block
4. 如果发现图片的bordr下方有多余部分，使用： vertical-align:top | middle清除多余部分
5. 有的时候，使用border反而会干扰布局，可以使用outline
6. margin-left:auto +margin-right:auto比 margin:0 auto更好
7. 要学会使用 负margin 方法
8. 平均布局，在原来的子元素和父元素之间再加一个div，然后设置margin:-x px