CSS布局终极方案之--圣杯布局(兼容IE6+,现代浏览器)
经典三列布局,也叫做圣杯布局【Holy Grail of Layouts】是Kevin Cornell在2006年提出的一个布局模型概念,在国内最早是由淘宝UED的工程师传播开来,在中国也有叫法是双飞翼布局,它的布局要求有几点:
三列布局,中间宽度自适应,两边定宽
中间栏要在浏览器中优先展示渲染
允许任意列的高度最高
要求只用一个额外的DIV标签
要求用最简单的CSS、最少的HACK语句
效果图:
CSS 和 DOM 代码如下:圣杯布局 头部主内容栏自适应宽度
侧边栏固定宽度
主内容栏自适应宽度
侧边栏固定宽度
主内容栏自适应宽度
侧边栏1固定宽度
侧边栏2固定宽度
主内容栏自适应宽度
侧边栏1固定宽度
侧边栏2固定宽度
主内容栏自适应宽度
侧边栏1固定宽度
侧边栏2固定宽度
底部