三栏自适应布局方法

前言：本文讲述的是两边栏宽度固定位200px，中间栏宽度自适应的布局，要想三栏宽度都自适应，将固定宽度改为百分比即可；

1.绝对定位法

这或许是三种方法里最直观，最容易理解的：左右两栏采用绝对定位，分别固定于页面的左右两侧，中间的主体栏用左右margin值撑开距离。于是实现了三栏自适应布局。
HTML：

    <div id="" class="left">左</div>
    <div id="" class="main"></div> 
    <div id="" class="right">右</div>

CSS:

*html, body{ margin:0;  height:100%; }
 .left,.right{
   position:absolute;width:200px;height:100 background-color:#ff6633; top:0;}
 .left{
   left:0;}
 .right{
   right:0;}
 .main{
   height:100%;  background-color: