HTML+CSS要点7：常见布页面布局

常见页面布局图

要点

1. float元素设置宽高后不会随着父级的变化而变化，而普通流会随父级（例如设置80%）变化而变化
2. 注意并列的div与float元素之间的顺序，先写div将直接占用一行，后写float将浮动在他的下一行

1 上中下一栏式

2 左右两栏式

2.1（混合浮动+普通流）

2.2 左右两栏式（纯浮动）

2.3 左右两栏式（定位）

3 左右两栏+页眉页脚

4 左中右三栏式

4.1 浮动加普通流

4.2 左中右三栏式之双飞翼

5 左中右三栏+页眉页脚