image.png

float布局

• 步骤

1. 子元素上加 float:left 和 width
2. 在父元素上加 .clearfix（重要）

  content:  '';
  display:  block;
  clear:  both;
}

image.png

• border调试时可能会干扰布局，这时可以用outline替代。

• 块级元素且宽度固定，如果要居中：
  margin:0 atuto;
margin-left:auto; margin-right:auto;
  更好

http://js.jirengu.com/xilodiqipe/16/edit?html,css,output