列布局，包含以下几种形式：
1、一列固定宽度
2、一列固定宽度居中
3、一列自适应宽度
4、一列自适应宽度居中
5、一列二至多块布局
列布局，包含以下几种形式：
1、一列固定宽度
一列固定宽度！CSS代码及在IE中显示如下：
此处显示 id "layout" 的内容
2、一列固定宽度居中
和一列固定宽度相比，我们要解决的问题就是居中。用到css的外边距属性：margin
#layout { height: 300px; width: 400px; background: #99FFcc; margin: auto; }
//margin的值为auto的时候可以达到这个功能。
3、一列自适应宽度
自适应宽度是相对于浏览器而言，盒模型的宽度随着浏览器宽度的改变而改变。这时要用到宽度的百分比。当一个盒模型不设置宽度时，它默认是相对于浏览器显示的。
4、一列自适应宽度居中
同样和固定宽度居中一样，我们只需要设置div的外边距为auto即可实现居中了。
body { margin:0px; }
#layout { margin:auto; height: 300px; background: #99FFcc; width: 80%; }
5、一列二至多块布局
一般的网站整体可以分为上中下结构，即：头部、中间主体、底部。那么我们可以用三个div块来划分，分别给它们起名为：头部（header）、主体（maincontent）、询问（footer）。
阅读(1974) | 评论(0) | 转发(0) |
