双飞翼布局

与圣杯布局的区别：

• 圣杯布局：中间元素的大小就是屏幕总宽减去left和right宽度值
• 双飞翼：中间元素的宽度依然是全屏宽的100%，只不过将显示内容用一个小div包起来，再用margin值将左右顶开
  两者出来的页面效果是一样的

<div class="center">
    <div class="child">center</div>
</div>
<div class="left">left</div>
<div class="right">right</div>

<style>
.center{
    width: 100%;
    background-color: pink;
    float: left;
    height: 200px;
}
.child{
    width: 100%;
    margin: 0 100px;
    height: 100%;
}
.left{
    width: 100px;
    height: 200px;
    float: left;
    margin-left: -100%;
    background-color: antiquewhite;
}
.right{
    width: 100px;
    height: 200px;
    float: right;
    margin-left: -100%;
    background-color: yellow
}