王志勇 发表于 2008年02月15日 09:49

这几天仔细研究了一下DIV+CSS，它的应用确实很不错，入门也较快。了解和学习DIV+CSS的最好方法就是，找一个最简单的教程，然后多练习几次，熟悉了这个原理，就能举一反三。DIV+CSS是近一两年开始在国际上流行起来的，很多共享的Blog程序，都是使用DIV+CSS的代码布局。

从本质上来说，DIV+CSS是网页技术人员的一个创意，把过去的table布局，使用DIV元素代替，然后这个创意，被广泛应用。我们具体谈谈DIV+CSS如何在重构网页上有优势。如果是单个网页进行重构，DIV+CSS代码布局比table布局不会有任何优势。当有很多个网页，如果重构后的DIV元素数量保持不变的话，只要更改公共的CSS部分即可，所有的网页都会一次发生变化。而使用table布局的网站，如果网站使用编程的话，公共程序无论是使用DIV+CSS还是table布局，也是更改程序就会一次发生变化。但是当有很多个公共程序的时候，或者有单个程序的页面，就需要一个一个网页地改。

在设计DIV+CSS布局时，需要非常注意DIV的区域名称的统一，以便于重构的简便。但是，网站并不需要频繁地重构，所以DIV+CSS在重构方面的优势就无法发挥。table布局的优势在于，它的历史比DIV+CSS悠久，table的使用简便。

DIV+CSS是否比table的结构更为清晰呢？我觉得不会，都一样，甚至非常之类似，几乎没有大变化。如果感觉不一样，可能是阅读代码的习惯不一样。DIV+CSS这一两年的应用，也在很大程度上推动了CSS的进展，使w3c标准得到了推广和日益普及。在DIV+CSS结构的网页中，几乎每一个元素的属性都是使用CSS定义，所以对于网页区域、元素的调整，真的起到了很大的便捷作用。而table布局中，如果table元素、td元素都是使用HTML参数，修改时可能需要进行批量修改。

顺便说说程序的调整和重构，它与DIV+CSS重构稍有类似。有时候，有好几个程序文件，需要同时更改多个变量名，或者同时删掉某部分，或者同时增加某段程序，需要一个一个程序地改，经常觉得很费时费力。减少这些重复重构的方法就是使用include文件，当然include的设计还是要花很多的心思，有时候已经把很多程序都做完了，还不及设计include文件。之所以这样，是因为include文件可能应尽量减少，不轻易使用，避免无法加载include文件而使网页报错。

总之，使用DIV+CSS还table布局，都没有关系，喜欢用哪一种就用哪一种，各有各的好处。如果你的网页在100K以内，完全可以使用table布局。DIV+CSS在页面下载方面，确实有table布局无法比拟的优势。DIV+CSS是一边下载，一边显示网页；大的table则是下载完毕之后，才显示这个table。table的解决办法就是，上下切割为多个table，就可以更好地一边下载一边显示网页。