DIV和table页面布局的区别和联系
创始人
2024-07-11 15:01:45
0

本文向大家描述一下DIV和Table页面布局的区别和联系,一般来说Table开发快,容易控制,浏览器兼容也好些,至于DIV的优势请看下文详解。

DIV和Table页面布局的区别和联系

现在对于网页制作是选择传统的Table还是用新型的DIV,有分歧。一部分说还是用Table好,开发快,容易控制,浏览器兼容也好些;另一部分认为DIV好,以后的发展趋势,主要是如下原因:

DIV+CSS布局比Table布局节省页面代码,代码结构也更清晰明了。

DIV+CSS开发速度要比Table快,而且布局更精确,不过手写代码明显增加DIV+CSS布局,使网站版面布局修改变的更简单。

DIV+CSS布局能够适应未来多种客户端需求。

DIV+CSS布局节约站点所占空间和站点流量。这些都是DIV的好处。

DIV有这么多好处是不是有些心动,决定学它。DIV和Table各有长处,通常情况下它们可以互换使用。

我感觉正确的符合标准的设计思路是:使用DIV等布局元素来制作页面的设计布局,定位,色块,图片等。使用Table,UL等这样的元素来显示页面中需要展示的数据。因为DIV不会像Table一样,在IE下要将整个Table下载完后才全部显示内容(firefox不会),所以用Table来布局显然是不合适的,尤其是数据量大时,在IE下用Table会发现慢的多。而DIV就好多了。当然,DIV也起整理数据的作用。

DIV用于布局,Table用于显示数据,这是现在最基本的设计原则。

1:Table里可以内嵌DIV。反之DIV可以内嵌Table吗??

当然可以了。

◆DIV定义

表示一块可显示HTML的区域。

SpecifiesacontainerthatrendersHTML.

注释

此元素在InternetExplorer3.0及以上版本的HTML中可用,在InternetExplorer4.0及以上版本的脚本中可用。

此元素是块元素。

此元素需要关闭标签。

  1. TheDIVelementisavailableinHTMLasofInternetExplorer3.0,
  2. andinscriptasof  
  3.  
  4. InternetExplorer4.0.  
  5.  
  6. Thiselementisablockelement.  
  7.  
  8. Thiselementrequiresaclosingtag.  

示例代码

下面的例子使用了两个DIV元素对两段文字进行了不同的对齐处理。

  1. ThisexampleusestwoDIVelementstoaligntwosectionsoftextdifferently.  
  2.  
  3.  
  4. 此文本代表一段。可以在这里放你的HTML或文本  
 
  •  
  • 此文本代表另外一段,其中文本居中显示。  
  •  

    DIV本身就是容器性质的,你不但可以内嵌Table还可以内嵌文本和其它的HTML代码。

    2:DIV是不是跟Table一样的作用?

    DIV的作用跟Table是差不多的,但是DIV对xml的支持更好而且使用起来比较灵活,因此被推荐为新的网页布局方式。

    3:DIV Table哪个速度快?

    DIV相对比较快,网页内容的显示需要将相对一整块的内容下载完成后再显示。使用DIV布局是许多的独立的相对较小的范围,而使用Table布局一般都会表格嵌套多层形成较大的下载范围。
     

    【编辑推荐】

    1. DIV+CSS中border和clear属性用法剖析
    2. CSS层叠与继承用法手册
    3. DIV布局规范中CSS类及id命名方式
    4. CSS网页布局中id与class命名规则
    5. 将XHTML+CSS页面转换为打印机页面技巧

     

     

    相关内容

    热门资讯

    PHP新手之PHP入门 PHP是一种易于学习和使用的服务器端脚本语言。只需要很少的编程知识你就能使用PHP建立一个真正交互的...
    网络中立的未来 网络中立性是什... 《牛津词典》中对“网络中立”的解释是“电信运营商应秉持的一种原则,即不考虑来源地提供所有内容和应用的...
    各种千兆交换机的数据接口类型详... 千兆交换机有很多值得学习的地方,这里我们主要介绍各种千兆交换机的数据接口类型,作为局域网的主要连接设...
    粉嫩如何诠释霸道 东芝M805... “霸道粉”是个什么玩意东芝M805拿过来的时候,笔者扑哧笑了,不是笑这款笔记本,而是笑这款产品的颜色...
    什么是大数据安全 什么是大数据... 在《为什么需要大数据安全分析》一文中,我们已经阐述了一个重要观点,即:安全要素信息呈现出大数据的特征...
    如何利用交换机和端口设置来管理... 在网络管理中,总是有些人让管理员头疼。下面我们就将介绍一下一个网管员利用交换机以及端口设置等来进行D...
    全面诠释网络负载均衡 负载均衡的出现大大缓解了服务器的压力,更是有效的利用了资源,提高了效率。那么我们现在来说一下网络负载...
    如何允许远程连接到MySQL数... [[277004]]【51CTO.com快译】默认情况下,MySQL服务器仅侦听来自localhos...
    30分钟搞定iOS自定义相机 最近公司的项目中用到了相机,由于不用系统的相机,UI给的相机切图,必须自定义才可以。就花时间简单研究...
    Intel将Moblin社区控... 本周二,非营利机构Linux基金会宣布,他们将担负起Moblin社区的管理工作,而这之前,Mobli...