传统的table布局与css布局【原创】

传统table布局方式利用了html的table元素所有的0边框特性。由于table元素可以在显示时，使得单元格边框和间距被设置为0，即不显示边框，所以可将网页中的各个元素按照版式划分后，分别放入表格的各个单元格中，从而实现了复杂的排版组合效果。

<table width=600 border="1" cellspacing="3" cellpadding="3">
  <tr>
     <td width="51%" rowspan="2" background="#000fff"><font color="blue">文本显示</font></td>
     <td width="30%" background="#000fff">&nbsp;</td>
     <td width="19%" background="#000fff">&nbsp;</td>
  </tr>
</table>

复杂的表格设计使得设计不容易，修改更加复杂，最后生成网页代码除了表格本身的代码外，还有许多多余的透明gif占位图及其他元素，使得网页文件量庞大，最终导致浏览器下载及解析速度变慢。

css布局，采用div，div可以理解为图层或者一个块。div功能仅仅用于将一段信息给标记出来，用于后期的样式定义。

目前流行的div+css，div考虑数据，css负责样式，修改方便，操作简单。

转载于:https://www.cnblogs.com/junzhongxu/archive/2008/11/04/1326090.html