float布局

float布局常用来适配IE9或更早的版本。

float布局的步骤：

1. 在父元素上加clearfix

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

2. 子元素加上float:left 和 width

• IE 6/7 可能会出现双倍margin的bug，所以我们在设置margin时可以设置为 原像素/2 或者 加一行 display:inline-block

• 块级元素居中

margin-left:auto
margin-right:auto

• 进行平均布局时可以使用负margin