方法一、左右两栏分别左右浮动,中间宽度自适应

 给中间的div左右margin,左边margin为左边div的宽度,右边margin右边div的宽度

父元素overflow:hidden清除浮动

三栏布局的几种方法

效果如下:

三栏布局的几种方法

方法二:圣杯布局

给父元素加左右padding,左中右都为向左浮动,中间宽度100%

三栏布局的几种方法

效果如下:

三栏布局的几种方法

方法三:双飞翼布局

给中间div加入子元素,给子元素设置左右margin,为左右div留位置。

三栏布局的几种方法

效果如下:

三栏布局的几种方法

相关文章: