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

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

父元素overflow:hidden清除浮动

三栏布局的几种方法

效果如下:

三栏布局的几种方法

方法二:圣杯布局

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

三栏布局的几种方法

效果如下:

三栏布局的几种方法

方法三:双飞翼布局

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

三栏布局的几种方法

效果如下:

三栏布局的几种方法

相关文章:

  • 2021-12-08
  • 2021-11-22
  • 2022-12-23
  • 2022-12-23
  • 2022-01-24
  • 2021-12-19
  • 2021-12-18
  • 2021-08-03
猜你喜欢
  • 2022-12-23
  • 2022-12-23
  • 2021-05-23
  • 2022-12-23
  • 2021-09-10
相关资源
相似解决方案