简单介绍网页布局教程

关于DIV+CSS进行页面布局的好处这里就不在多说了，很多朋友看了教程后还是不知道如何下手，这里简单介绍一下布局过程。
1、顶部部分，其中包括了LOGO、MENU和一幅Banner图片；

2、页面中间部分，那就是我们的主体了，这里就以我们为一客户做的站点为例来说明。考虑到该行业要求打开首页快速，所以我们在网站发布的信息设 计为三列。

3、底部，包括一些版权信息。
根据以上设想，我们定义如下div的结构
DIV结构如下：
　　
│body {}　/*这是一个HTML元素*/
　　
└#Container {}　/*页面层容器*/
　　　　　
├#Header {}　/*页面头部*/
　　　　　
├#MianBody {}　/*页面主体*/
　　　　　
│　├#mainbody-left {}　/*主体页面左边*/
　　　　　
│　└#mainbody-center {}　/*主体页面中间*/

│　└#MainBody -right{}　/*主体页面右边*/
　
└#footer {}　/*页面底部*/

用DIV+CSS做一个导航栏是非常容易的，而且我们可以通过css来对导航栏的样式方便的作出调整。用div设置导航栏一般就用<ul>和<li>标签。

4、高度显示效果不同
一般情况下只需要使用height: 100px;即可，当显示效果不同时，则可以_height: 100px;来对IE6的高度进行设置。

5、嵌套效果不不同.
有些情况下如果div中嵌套的图片大于外层div的高度，则IE6中对高度的设置始终无效，这时要注意对该css添加overflow属性，overloaw:hidden,则可隐藏超出边界的部分。