DIV+CSS布局和Table布局对比

虽然目前大多数网页都是采用的DIV+CSS布局的方式,但是也有少数的老式Web网页采用的是Table布局,我们可以一起来看看两种布局方式的优劣。

那些你不知道的HTML知识,快来学习一下吧

布局对比

  • div+css布局

  1. div+css的布局方式属于W3C标准,而且由于CSS的存在,HTML部分的代码会显得很纯净,满足行为,样式,结构分离的原则。

  2. 页面加载速度更快,这是目前DIV+CSS使用更广泛的一个非常重要的原因。

  3. 页面编码量相对于Table布局会少很多。

  4. 页面内容更容易维护,由于样式都存在CSS文件中,只需要修改CSS文件即可,对HTML文件不会有影响。

  5. 由于DIV+CSS布局更容易进行SEO优化,所以更方便被搜索引擎收录。

  • Table布局

虽然DIV+CSS有各种各样的优势,但是Table布局也并不是完全无用的。这里也可以列举出几个采用Table布局的优势。

  1. 新手学习方便(相信有很多后端RD在进行前端学习时刚开始都是从table布局开始的)。

  2. 兼容性更好,由于Table布局是从最古老的浏览器发展而来的,在兼容性上会满足所有浏览器。而CSS3的出现却要考虑浏览器的支持程度,一个样式要考虑加上几个不同浏览器前缀,类似于-webkit,-moz等

推荐阅读