1. 负边距在让元素产生偏移时和position: relative有什么区别?
- 负边距是改变外边框移动元素，会带动其他元素改变位置，而position:relative虽然会偏移，但不会改变其他元素位置，只会让自己便宜
- position:relative是基于自己偏移，负边距是基于父元素内边框或者兄弟元素外边框偏移
2.使用负 margin 形成三栏布局有什么条件?
- 父元素要有3个子元素，并且都向左浮动 父元素清除浮动
- 左边的aside的margin-left应为100%
- 右边的extra应取值为自身的宽度负值（相同）
- 左右两边都需要position:relative
- 如果中间内容没有设置宽度的话，应该设为width:100%
3.圣杯布局的原理是怎样的? 简述实现圣杯布局的步骤
- 原理：利用负边距，float，positive:relative实现。
- 步骤
- 设置一个父元素div，并设置三个子元素main(中间)aside(左边)extra(右边)
- 中间的main应设置width为100%，高度自定义，并且向左浮动。
- 同理，左边的aside和右边的main都应向左浮动，并且使用positive:relative进行定位，宽高取决于你自己。
- 进行定位后，其中左边的aside应left:自身宽度负值，同时margin-left:100%偏移到到main内边框的左边
右边的extra应left:(自身宽度值),margin-left:-100px（通常是-100px） - 父元素清除浮动，并且进行Padding的内边框设置
如图：
圣杯布局样式.png
4.双飞翼布局的原理? 实现步骤?
- 原理：和圣杯不同，双飞翼主要是在中间的main创建一个盒子进行调节，而左右是利用float和负边距。
- 步骤
- 设置一个父元素div，并设置三个子元素main(中间)aside(左边)extra(右边)
其中，中间的main再设置一个wrap子元素 - 中间的main应设置width为100%，高度自定义，并且向左浮动，但是不用设置颜色。
- 在wrap子元素中，高度和main一样，但是margin-left和margin-right根据自己的需要改变，两边相同
- 左（aside）和右(extra)向左浮动，同时左边（aside）设置为margin-left:-100%，右边(extra)设置为（margin-left）自身宽度
- 父元素清除浮动
如图：
双飞翼布局样式.png
