双飞翼布局(三排布局双侧固定、中间自适应)双飞翼布局；三排布局双侧固定、中间自适应)双飞翼布局(三排布局双侧固定、中间自适应)情况下，需要注意双飞翼布局实现流程的概述
案例要求
实现3列布局：
布局固定在左中右三部分左右两侧的宽度上， 可自适应中间内容区宽度实现双翼布局的过程概述第一步：使用float属性浮动左中右三列第二步：使用负margin属性使左右两列与中间列位于同一水平线上第三步：在中间列添加div内容元素， 将边距值设置为左右两列宽度的第四步：成功显示要清除浮动的父元素高度的注意详细信息点左中右三个框的顺序需要注意div class='center' //其中三个框的顺序。 首先中间的框div class='content '自适应内容区域/div/divdivclass=' left '/divdivclass=' right '/div两侧的div实际上位于中间div的上层
如果框位于同一水平线上，则使用负边距。
对于左框，边距-左值为- 100 % (中心宽度)，显示在内容区域的左侧。 对于“right”框，边距-左值将自己的宽度设置为负，以便显示在内容区域的右侧。 (-200px )； 中间列内容元素显示如果三个箱子位于同一水平线，则内容区域显示的内容由两侧的箱子覆盖，因此设定内容区域左右的边距，值为两侧的箱子宽度；
. content{ margin: 0px 200px； //内容区域左右的边距值为两侧的宽度}
详细代码title双飞翼布局/title style.box { border :1 pxsolidred； width:800px； margin :0自动； Overflow :隐藏； }.center{ float: left； width: 100%； height:500px； 背景色： # 4c 8045； }.left{ float: left； 背景色： # DBA 893； width: 200px； height: 500px； margin-left: -100%；//确认三个箱子在同一水平线上，且左侧箱子在中间箱子的左侧}.right{ float: left； 背景色： # 788 a74； width:200px； height:500px； 玛格琳- left :-200 px； //margin值为右侧框本身的宽度}.content{ margin: 0px 200px； //内容区左右边距值注意两侧宽度}/style/headbodydivclass=' box ' divclass=' center '//这里注意三个箱子的顺序，中间的箱子div class=' cood