两栏布局
float+margin（一侧定宽，一侧自动）
在线预览：
See the Pen JKwjwL by abcdGJJ (@abcdGJJ) on CodePen.
原理：左div定宽浮动，右div正常文档流并以左div左上角布局，右div中的文字围绕在浮动元素周围。为了使右div相对于左div布局，需要加上margin-left属性。
笔记：float元素浮动后拥有块元素属性
position+margin（一侧定宽，一侧自动）
在线预览：
See the Pen dXwPpA by abcdGJJ (@abcdGJJ) on CodePen.
原理：使用absolute脱离文档流，文字不围绕在absolute元素周围
float+负margin（一侧定宽，一侧自动）
在线预览：
See the Pen QEzwvp by abcdGJJ (@abcdGJJ) on CodePen.
原理：使用父元素占位，左div设置负margin补位
三栏布局
float+margin（两侧定宽，中间自适应）
在线预览：
See the Pen dXwPjb by abcdGJJ (@abcdGJJ) on CodePen.
原理：左右浮动，中间宽度100%，加上margin。注意：左右两侧的div需要写在中间的div之前
position+margin（两侧定宽，中间自适应）
在线预览：
See the Pen AXYjJJ by abcdGJJ (@abcdGJJ) on CodePen.
原理：脱离文档流，但中间div不必写在最后
float+负margin（两侧定宽，中间自适应）
在线预览：
See the Pen rLoaQK by abcdGJJ (@abcdGJJ) on CodePen.
原理：负margin运用
float+position+margin（两侧自动，中间定宽）
在线预览：
See the Pen OXAPGp by abcdGJJ (@abcdGJJ) on CodePen.
原理：左右浮动，中间绝对定位
position+margin（两侧自动，中间定宽）
在线预览：
