负边距在让元素产生偏移时和position: relative有什么区别?
- 负边距产生位移时，页面内的元素会根据位移后的位置进行渲染，并不占据原来的空间
- position:relative是相对于元素本身做偏移，但是元素并不脱离文档流，原来所占据的空间依然会被保留。
使用负 margin 形成三栏布局有什么条件?
- 侧边栏及中间元素均浮动浮动
- 父元素清除浮动
- 当相邻两个元素均浮动，第二个元素的负margin大于自身宽度，第二个元素会跑到第一个元素的上方产生覆盖。
- 左边margin-left为-100%，也就是为负的父元素的宽度，跑到父容器的左边形成左侧边栏。右边栏为margin-left的负自身宽度，跑到父容器的右边形成右侧边栏
- 对位置进行细调节，形成三栏布局
圣杯布局的原理是怎样的? 简述实现圣杯布局的步骤
- 利用相邻元素均为浮动时，第二个元素使用负margin会跑到第一个元素上方覆盖，然后通过父元素添加padding属性进行调节
- 中间、两侧元素文档流布局，均设为左浮动
- 给父元素添加clearfix样式清除浮动（添加一个空的包含块并清除浮动）
- 左侧边栏的margin-left为-100%，也就是为负的父元素的宽度，跑到父容器的左边。右侧边栏为margin-left的负自身宽度，跑到父容器的右边。
- 父元素添加左右padding样式，留出两个侧边栏的空间
- 利用position:relative属性调节两侧的元素至侧边栏位置。
- 形成圣杯布局。
双飞翼布局的原理? 实现步骤?
- 利用相邻元素均为浮动时，第二个元素使用负margin会跑到第一个元素上方覆盖，然后父元素的中间添加一个元素进行调节
- 中间、两侧元素文档流布局，均设为左浮动
- 给父元素添加clearfix样式清除浮动（添加一个空的包含块并清除浮动）
- 左侧边栏的margin-left为-100%，也就是为负的父元素的宽度，跑到父容器的左边。右侧边栏为margin-left的负自身宽度，跑到父容器的右边。
- 在父元素中间添加一个元素，使左右margin等于两侧元素的宽度，是其内容位于中间，留出两个侧边栏的空间
- 形成双飞翼布局。
