Div+CSS布局特点
Div+CSS布局网页特点主要是有这些：1.与CSS样式表联系更加紧密;2.结构扁平;3.更加注重兼容性。如果想具体了解Div+CSS布局特点，那不妨接着往下看吧!
Div+CSS布局网页，即以Div块级元素，而样式交由CSS样式来控制一个网页的设计形式，也是目前比较流行的网页设计标准。
与基于表格的设计方式不同，Div+CSS布局可以更明确地将网页的内容和样式分开。
鉴于Div和Table都是XHTML或HTML语言标签，Div+CSS布局的标准名称应该是XHTML+CSS，但设计师们都同意这样称呼它，而且至今仍在使用。
由于Div和CSS密切相关，在随后的内容中，除非另有说明，否则将使用"Div网页"这一名称，而不是"Div+CSS布局网页"。
与表格设计相比，Div网页具有以下特点。
1、与CSS样式表联系更加紧密。即使没有样式表的存在，基于表格的网页的基本结构也是固定的，而Div网页只是单个Div的列表，没有样式表的连接，网站的风格可以有很大的不同。
2、结构扁平。Div网页的嵌套层级较少，每个Div元素都尽可能地平行排列，形成扁平结构。这样对搜索引擎更友好，与表格页面相比，页面负担也相对较小。
3、更加注重兼容性。表格设计由来已久，所以各种浏览器对表格页面的支持非常好;而Div页面的兼容性相对较差，所以我们在编写代码时要考虑到这一点，尽量照顾到各种浏览器的显示机制，避免错位等异常情况。
CSS常见布局样式
较为常见的CSS布局样式主要是有两种：一是两列布局样式;二是三列布局样式;其中三列布局样式又分为“两列定宽、中间列自适应”的三列结构和三列自适应结构。
1、两列布局样式
许多网站都有一些共同的特点，即页面顶部放置一个大的导航或广告条，右侧是链接或图片，左侧放置主要内容，页面底部放置版权信息等。
在一般情况下，此类页面布局的两列都有固定的宽度，而且从内容上很容易区分主要内容区域和侧边栏。页面布局在整体上分为上、中、下三个部分，即header区域、container区域和footer区域。
其中的container又包含mainbox(主要内容区域)和sidebox(侧边栏)。
2、三列布局样式
三列布局在网页设计时更为常用。对于这种类型的布局，浏览者的注意力最容易集中在中栏的信息区域，其次才是左、右两侧的信息。
三列布局与两列布局非常相似，在处理方式上可以利用两列布局结构的方式处理。三列布局仅比两列布局多了一列内容，无论形式上怎么变化，最终还是基于两列布局结构演变出来的。
(1)“两列定宽、中间列自适应”的三列结构。
设计人员可以利用负边距原理实现“两列定宽、中间列自适应”的三列结构。
这里负边距值指的是将某个元素的margin属性值设置成负值，对于使用负边距的元素可以将其他容器“吸引”到身边，从而解决页面布局的问题。
(2)三列自适应结构。
实现三列自适应结构，要从改变列的宽度入手。首先，要将submainbox和sidebox两列的宽度设置为自适应;其次，要调整左、右两列有关负边距的属性值;最后，要对内容区域content容器的外边距margin值加以修改。
