css中常见的两列和三列布局：主要介绍三列
2018-08-15 本文已影响0人
赵xiao赛
两类布局的直接上代码
float+margin实现两列布局
三列布局的几种方法：
| 圣杯 | 双飞翼 | flex | position+margin | float+margin |
|---|---|---|---|---|
| 中间内容优先渲染 | 中间内容需要加容器包裹 | 熟悉flex属性含义即可 | position he top的配合 | 使用float，注意他的特性，应该是right的内容在最上面显示 |
下面直接是上面几种方法的代码：
圣杯布局.jpg
双飞翼布局方法.jpg
flex实现三列布局.jpg
position+margin.jpg
margin+float.jpg
下面附上小弟学习的参考资料，希望对大家有帮助。
圣杯布局、双飞翼布局、Flex布局和绝对定位布局的几种经典布局的具体实现示例
