DIV+CSS布局

页面布局一般有三种方式：

1. 表格布局
2. 框架布局
3. DIV+CSS布局

当中。DIV+CSS布局符合W3C标准，眼下已成为网页布局主流。

   <div>标签的主要作用是用于设定文字、图片、表格等的摆放位置。

当把文字。图片等放在<div>标签中时，该标签被称为“DIV块”或“DIV元素”或“DIV层”。 

使用CSS和DIV能够非常好的解决图像或文字定位的难题，通过DIV和CSS结合使用，网页设计人员能够精确的设定内容的位置，还能够将定位的内容上下叠放。 使用DIV+CSS布局，可先先将页面内容的语义或结构确定下来而不是先考虑外观。

一个结构良好的XHTML页面能够通过CSS以随意外观表现出来。

CSS布局能实现真正意义上的结构和外观的分离，与传统的TABLE网页布局相比，具有下面4个显著优势：

1、表现和内容相分离。

将设计部分剥离出来放在一个独立样式文件里，XHTML文件里仅仅存放文本信息。
2、提高搜索引擎对网页的索引效率。用仅仅包括结构化内容的XHTML取代嵌套的标签，搜索引擎将更有效地搜索到你的网页内容，并可能给你一个较高的评价。

3、提高页面浏览速度。对于同一个页面视觉效果，採用DIV+CSS重构的页面容量要比TABLE编码的页面文件容量小得多，前者一般仅仅有后者的1/2大小。

给用户最直观的体验就是网页打开速度快了非常多，能给用户更好的体验。
4、易于维护和改版。你仅仅要简单的改动几个CSS文件就能够又一次设计整个站点的页面。   

 利用DIV和CSS的定位技术进行网页的布局是如今主流的页面布局模式，是TABLE页面布局的替代技术。採用CSS+DIV布局的页面容量要比用TABLE布局的页面文件小非常多，前者一般仅仅有后者的1/2大小，节省了大量的带宽，同一时候减少了站点改版的成本。W3C组织提供对CSS代码的验证服务，地址在：
http://jigsaw.w3.org/css-validator/

转载于:https://www.cnblogs.com/ldxsuanfa/p/10572238.html