一夷磕，負邊距在讓元素產(chǎn)生偏移時和position: relative有什么區(qū)別?
答：position:relative：只有元素本身會發(fā)生偏移，它還占據(jù)著原來的位置亏拉，后面的元素不會受到影響扣蜻。
負margin：
當(dāng)把元素的margin設(shè)為負數(shù)的時候逆巍，不僅元素本身會移動，覆蓋其他元素莽使，也會影響到后面的元素發(fā)生位置偏移锐极。
二，使用負 margin 形成三欄布局有什么條件?
答：首先三欄都得浮動,父元素清除浮動芳肌。
左側(cè)邊欄設(shè)置margin-left:-100%;
右側(cè)邊欄設(shè)置margin-left為本身寬度的負值灵再。
左右兩邊欄需要相對定位position:relative。
寫html布局時亿笤，中間內(nèi)容區(qū)塊在需要放在三欄的第一位翎迁。
三，圣杯布局的原理是怎樣的? 簡述實現(xiàn)圣杯布局的步驟
答：
原理：利用負margin實現(xiàn)净薛。
左右兩個側(cè)邊欄寬度固定汪榔，中間主內(nèi)容區(qū)塊寬度自適應(yīng)的布局方式。左右側(cè)邊欄區(qū)塊和中間主內(nèi)容區(qū)塊都設(shè)置浮動肃拜，然后三欄的父元素設(shè)置padding揍异，使兩邊留出空白。左側(cè)邊欄區(qū)塊設(shè)置margin-left:-100%爆班，右側(cè)邊欄區(qū)塊設(shè)置margin-left值為區(qū)塊本身的寬度再配合相對定位即可。
方式：
- 寫出html辱姨，三欄的中間內(nèi)容區(qū)在最上面柿菩，左右側(cè)邊欄在后面。
- 設(shè)置好寬高雨涛，內(nèi)容區(qū)設(shè)置寬度為100%枢舶。并且都設(shè)置左浮動。
- 給父元素設(shè)置左右padding替久，padding值為左右側(cè)邊欄寬度凉泄，并且清除浮動。
- 左側(cè)邊欄設(shè)置margin-left:-100%;設(shè)置相對定位（relative）left自身寬度值蚯根。
- 右側(cè)邊欄設(shè)置margin-left:-100px;設(shè)置相對定位（relative）right自身寬度的負值后众。
圣杯布局
四，雙飛翼布局的原理? 實現(xiàn)步驟?
答：
和圣杯遠離幾乎相同颅拦，雙飛翼布局時候中間主體內(nèi)容內(nèi)加了一個DIV的包裹層蒂誉。
- 形成三欄的三個塊級元素必須浮動。
- 父容器利用偽類清除浮動距帅；
- 主體main放前面右锨，有利渲染和SEO；
- 主體容器內(nèi)添加一個div容器碌秸，并且設(shè)置左右外邊距绍移；
- 左邊欄margin-left:-100%, 右邊欄 margin-left:-本身寬度悄窃；設(shè)置兩個側(cè)欄的寬度。
- 最終形成雙飛翼布局.
雙飛翼布局
與圣杯布局的區(qū)別：
- 主題main加了一個div容器蹂窖，設(shè)置了左右marigin轧抗。
- 左右側(cè)邊欄不需要相對定位。
