三栏式布局的圣杯布局与双飞翼布局

圣杯布局与双飞翼布局都属于三栏式布局，是一种两边盒子固定宽度，中间盒子自适应的布局。

圣杯布局和双飞翼布局相同点：
1.父元素包含左中右三个子元素，分别左浮动
2.中间元素宽度100%（必须为第一个渲染）
3.用margin-left的负值将三个盒子位于同行，其中左元素负值-100%，右元素-右盒子宽度
4.在父元素上清除浮动

圣杯布局：
A.不同点：
1.用左右padding为左右盒子留出位置
2.相对定位将左右元素移动到正确位置上
B.优点
不需要添加DOM结点
C.缺点
当center宽度小于left时会发生布局混乱
D.操作
1.CSS部分

2.DOM部分

双飞翼布局：
A.不同点
给中间元素设置子元素并给其左右margin为左右盒子留出位置
B.优点
不会发生布局混乱
C.缺点
需要多添加DOM结点
D.操作
1.CSS部分
body设置min-width方式拖放缩小时布局混乱
2.DOM