关注联楷|返回首页 | 网站案例 | 帮助中心

合作共赢、快速高效、优质的网站建设提供商

上海网站建设 

服务热线:021-61394118

上海联楷科技

网站中的表格布局与div布局

作者:佚名   时间:2014-05-27   分享到:

CSS布局的重点不再放在table元素的设计上。取而代之的是HTML中的另一个元素div的设计。Div可以理解为图层或是一个‘块”。div是一种比表格简单的元素.从语法上只有从<div>开始以</div>结束这样一个简单的定义。div的功能是用于将一段信息标记出来后用于后期的样式定义。这里的信息标记,是网页的“结构”部分。DIV的使用可以将网页中的各个元素划分到各个DIV中.成为网页中的结构主体。而样式表规则由CSS完成。

div在使用时不需要像表格一样通过其内部的单元格组织版式,通过CSS强大的样式定义功能可以使DIV比表格更简单、更自由地控制页面版式及样式。
传统的table布局的核心实际上是利用了HTML table表格元素具有的无边框特性。由于table元素可以在显示时使得单元格的边框和间距设置为0.即不显示边框,因此可以将网页中的各个元素按版式的划分放入表格的各个单元格中,从而实现复杂的排版组合。

Table布局的核心在于设计一个能满足版式要求的表格结构,再将内容装入每个单元格中,间距和位置通过插入图像进行占位来实现,其最终
的结构是一个复杂的表格,这一点不利于设计与修改。

表格布局的代码最常见的是在HTML标签<>之间加入一些设计代码,width="100%",表格布局的混合代码就是这样编写的。大量样式设计代码混杂在表格、单元格之中.使得代码的可读性大大降低,维护起来也相当困难。

复杂的表格使得设计工作极为不易,修改起来更加复杂。最后生成的网页代码除了表格本身的代码.还有许多没有意义的图像占位符及其他元素.文件极其庞大.最终导致浏览器下载及解析速度变慢。



如没特殊注明,文章均为上海联楷网络原创,转载请注明来自:http://www.linksj.com/build/20151229/n7216.html

上海联楷网络新闻