双飞翼布局和圣杯布局 闹闹不爱闹 2018-05-29 193 阅读1分钟 两个布局实现的目的都是两边内容定宽,中间内容宽度自适应。也就是三栏设置浮动,左右两栏设置负margin让其跟中间div并排。不同点是解决中间内容不被遮挡的方式:双飞翼是给中间内容嵌套一层div,给子div设置margin-left和margin-right,给两边的div留下位置。圣杯是给中间div设置了padding-left和padding-right,将左右两个div设置position:relative;并配合right和left属性,以便左右div移动后不遮挡中间内容。