介绍曾经在江湖上广为流传的双飞翼布局，人尽皆知，人尽皆知。大致意思就是左右两个框的宽度是固定的，剩下的中间部分可以自由缩放。考虑到一般网站的主体部分都在中间，用户首先需要看到的就是中间部分。因此，将中间的div放在顶部，如下图所示。双飞翼布局经典实现//HTML部分 自适应主内容列宽度
介绍曾经在江湖上广为流传的双飞翼布局，人尽皆知，人尽皆知。大致意思就是左右两个框的宽度是固定的，剩下的中间部分可以自由缩放。考虑到一般网站的主体部分都在中间，用户首先需要看到的就是中间部分。因此，将中间的div放在顶部，如下图所示。双飞翼布局经典实现//HTML部分 自适应主内容列宽度
侧边栏1固定宽度
侧边栏2固定宽度
侧边栏1固定宽度
侧边栏2固定宽度
第一种：//利用flex布局的order属性轻松实现。.container{显示：flex;宽度：100%；}.main{弹性：1；order:2;}.??aside-1{flex:00200px;order:1;}.aside-2{flex:00200px;顺序：3；}//使用绝对定位，加上box-sizing，也可以达到效果。.container{width:100%;}.container>div{float:left;}.main{width:100%;}.middle{margin:0200px;}.aside-1{width:200px;-100%;}.aside-2{宽度：200px;左边距：-200px；}由上可见，随着前端开发大潮的汹涌澎湃，所谓双飞翼、圣杯布局将被历史淘汰，迎来新时代。