精华内容
下载资源
问答
  • table布局和div布局的区别 背景 早期的网页布局,基本都是采用table布局的。早期的网页相对来说比较的简单,类似于报纸一样,只有文字和静态的图片。对于这样子的需求,table布局是使用的。但是随着W3C(万维网联盟...

    table布局和div布局的区别

    背景

    早期的网页布局,基本都是采用table布局的。早期的网页相对来说比较的简单,类似于报纸一样,只有文字和静态的图片。对于这样子的需求,table布局是使用的。但是随着W3C(万维网联盟)以及其他标准的出现,还有现在网页的呈现、网页的布局变得多样化了,table布局也变得不适用了。table现在也只用来显示数据而已,基本没有应用到布局上。

    table布局

    先来谈一谈table布局吧!

    • 首先是table布局的缺点:

      1. 采用table布局的页面,如果table嵌套的层数太多的话,可能会导致页面一直出不来的情况。因为table布局的网页要等table全都加载完,再进行页面的呈现。页面一直出不来,那这样用户的体验感就会很差。
      2. table布局如果嵌套的table太多,会导致代码结构过于复杂,容易混乱。
      3. table布局没有实现结构(html)、表现(css)的分离,这样代码的结构就做不到很清晰了,所有的代码都混杂在一起。
    • 但是,table布局还是有其优点的,如下:

      1. 容易上手。table布局就是用table来布局,只要在对应的位置填上对应的内容就可以了。相对来说,还是比较的简单明了的。
      2. 表现上更加的“严谨”,在不同的浏览器,可以做到很好的兼容。

    div+css布局

    现在普遍使用的人都是div+css布局了,让我们一起来看看她有哪些优势吧!

    • 优点:

      1. 加快页面的加载速度。div布局有一个很好的地方是,它是一边加载,一边呈现的,这样网页基本不会出现一直出不来的情况,至少基本网页结构可以很快的呈现出来。这样用户的体验感就会很好。这是比table布局好的一个点。

        我觉得这个点其实是很重要的,你想想,如果是你打开一个网页,打开了好几分钟,还什么都没有出来,你是不是再也不想去访问这个网页了。

      2. div布局符合了W3C的标准,做到了结构、表现、行为(js)的分离。相当于给代码分类,每一类代码做什么事情都清楚明了,使得代码能够更好的维护。

      3. 节约站点所占的空间和站点流量。

      4. 用只包含结构化内容的html代替嵌套的标签,提高搜索引擎对网页的搜索效率。

        原因:当用户进行搜索时,它会从事先抓取到的大量有关联性的索引中,搜索所有包含用户输入的关键字的网页。然后根据算法给每一个网页一个总评分,再根据评分的高低给用户返回搜索结果。这其中包含关键字的内容,可以是文章标题、描述、关键字、内容、甚至还有链接等。而html中的标签(取一个有意义的贴合网页内容的标题)、元标签(关键字)、语义化元素(<h1>、<b>、<i>)等,都可以更好、更清晰准确地找到关键字,匹配到更贴合的网站。从而提高搜索的效率。</i></b></h1>

      5. 布局更加灵活多样,可以通过选择不同的样式来实现界面设计的更多不同的要求。

    • 缺点:

      1. 开发技术高,要考虑兼容不同版本的浏览器

    总结:

    今天上课,老师刚好讲了一点点table布局和div布局的区别,下课后,我便自己查阅了资料,大概整理出来了它们之间的区别。

    收获还是挺多滴,开心~

    好啦,这次的分享就到这里啦~

    展开全文
  • table布局的渲染是将整个table全部渲染出来,如果网路不给力的情况下,整个table会卡死在页面div布局的话,页面渲染,会一个一个的div渲染,网页出现会一个一个出来,不管网速怎样,不会全局卡死 ...

    table布局的渲染是将整个table全部渲染出来,如果网路不给力的情况下,整个table会卡死在页面
    div布局的话,页面渲染,会一个一个的div渲染,网页出现会一个一个出来,不管网速怎样,不会全局卡死

    展开全文
  • DIV布局和Table页面布局的区别和联系 现在对于网页制作是选择传统的Table还是用新型的DIV,有分歧。一部分说还是用Table好,开发快,容易控制,浏览器兼容也好些;另一部分认为DIV好,以后的发展趋

    本文向大家描述一下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及以上版本的脚本中可用。

    此元素是块元素。

    此元素需要关闭标签。

    示例代码

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

    1. <DIV> 
    2. 此文本代表一段。可以在这里放你的HTML或文本  
    3. </DIV> 
    4. <DIVALIGNDIVALIGNDIVALIGNDIVALIGNDIVALIGNDIVALIGNDIVALIGNDIVALIGN=CENTER> 
    5. 此文本代表另外一段,其中文本居中显示。  
    6. </DIV> 
    7.  

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

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

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

    3:DIVTable哪个速度快?

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


    文章出自:http://blog.sina.com.cn/s/blog_66ea0e280100ribg.html


    展开全文
  • DIV和table页面布局的区别和联系

    千次阅读 2012-06-01 15:15:00
    本文向大家描述一下DIV和Table页面布局的区别和联系,一般来说Table开发快,容易控制,浏览器兼容也好些,至于DIV的优势请看下文详解。  DIV和Table页面布局的区别和联系  现在对于网页制作是选择传统的Table...
    本文向大家描述一下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及以上版本的脚本中可用。

      此元素是块元素。

      此元素需要关闭标签。

      TheDIVelementisavailableinHTMLasofInternetExplorer3.0,andinscriptasof InternetExplorer4.0. Thiselementisablockelement. Thiselementrequiresaclosingtag.

      示例代码

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

     

    1. ThisexampleusestwoDIVelementstoaligntwosectionsoftextdifferently.    
    2.    
    3. <DIV>   
    4. 此文本代表一段。可以在这里放你的HTML或文本    
    5. </DIV>   
    6. <DIVALIGNDIVALIGNDIVALIGNDIVALIGN=CENTER>   
    7. 此文本代表另外一段,其中文本居中显示。    
    8. </DIV>  

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

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

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

      3:DIV Table哪个速度快?

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

    转载地址:http://blog.csdn.net/chinalogs/article/details/7617124

    展开全文
  • 现在对于网页制作是选择传统...div+css布局比table布局节省页面代码,代码结构也更清晰明了。 div+css开发速度要比table快,而且布局更精确,不过手写代码明显增加div+css布局,使网站版面布局修改变更简单。...
  • 采用CSS+DIV对网页进行布局可以大大提升网站用户与搜索引擎友好度。1:表现内容相分离 将设计部分剥离出来放在一个独立样式文件中,HTML文件中只存放文本信息。 2:提高搜索引擎对网页索引效率 用只包含结构化...
  • table布局DIV+CSS布局的区别

    千次阅读 2015-08-26 11:32:04
    2.布局的时候灵活度不高 3.一个页面可能会有大量的table元素 代码冗余度高 4.增加带宽 5.搜索引擎不喜欢这样的布局 优点 1.理解比较简单 2.不同的浏览器看到的效果一般相同 3.显示数据还是很好的 DIV+...
  • div+css做html的布局,请问div和span有什么区别?span不能做布局么?table
  • DIV布局和Table布局的区别传统Table布局方式实际上是利用了HTMLTable表格元素具有的无边框特性,由于Table元素可以在显示时使得单元格的边框和间距为0,即不显示边框,因此可以将网页中的各个元素按版...
  • table布局div布局

    2015-09-01 21:44:00
    DIVTABLE本身并不存在什么优缺点,所谓web标准只是推荐的是正确的使用标签,好比说:DIV用于布局,而TABLE则本来就是转二... 中国的门户国外的有很大的区别,中国网民并不喜欢信息量少的页面,YAHOO到了中国页...
  • 都知道用div的布局代码肯定少,所有的样式都在CSS里做完了,同样的板块重复调用就行, 这样就会减少页面的体积,下载的当然就会快一些,所以打开速度比用table布局的要强一些。 这个速度差在中小网站里看不出来,是...
  • 起因 项目针对用户主要是IE8用户 做法 前期采用Div布局 IE8IE6、7、9以上的区别 Div也可以布局 Table布局
  • Divtable的区别

    千次阅读 2017-04-21 12:29:15
    看了几篇描述div和table区别的文章觉得下面...本文向大家描述一下DIV和Table页面布局的区别和联系,一般来说Table开发快,容易控制,浏览器兼容也好些,另一部分认为DIV好,是以后的发展趋势,主要原因请看下文详细介绍
  • DIVTABLE布局的区别   div table 的加载方式不同,div 的加载方式是即读即加载,遇到 <div> 没有遇到 </div> 的时候一样加载 div 中的内容,读多少加载多少;table 的加载方式是完成后...
  • DIV+CSS和Table区别

    千次阅读 2016-05-11 23:27:03
    众所周知,这(DIV+CSS和Table)两种语句都经常被开发人员使用了来控制界面显示,但是这两种语法也有很大不同,下面分别从这两种语句优缺点进行分析: 一、制作效率 我想没人反对表格制作效率要...
  •  中国的门户国外的有很大的区别,中国网民并不喜欢信息量少的页面,YAHOO到了中国页面上的内容就多了不少,而上次改为简洁的页面后访问量下降的厉害以至于没过几天就又改了回来。正式由于中国的国情造就了搜狐、...
  • table div+css 的区别

    2020-08-21 11:46:32
    table div+css 的区别 ==table:==加载方式是完成后加载,遇到 后,在读到 之前, 中的内容不加载;布局受到限制。div::加载方式是即读即加载,遇到 没有遇到 的时候一样加载 中的内容,读多少加载多少;布局...
  • div和table的区别(1)

    2011-11-15 21:07:00
    现在对于网页制作是选择传统TABLE还是用... div+css布局比table布局节省页面代码,代码结构也更清晰明了。 2.div+css开发速度要比table快,而且布局更精确,不过手写代码明显增加div+css布局,使网站版面布局修改
  • divtable的区别 1:速度加载方式方面的区别 div table 的差异不是速度,而是加载方式,速度只能是指网络速度,如果速度足够快,是没有差异的: div 的加载方式是即读即加载,遇到 没有遇到 的时候...
  • 网页布局Div vs Table

    2014-07-09 09:55:46
    那么div和table布局究竟有那些联系和区别呢?我们又该如何进行网页布局呢?   下面对这两种网页布局进行一些探讨。看了一些大公司网页布局,其中腾讯,网易,中国移动等公司都使用div进行布局。而工商...
  • DivTable的区别

    2014-04-12 22:58:25
    很明显Div布局代码全部都要手写。即使你在熟悉代码,也没有 Dreamweaver生成来的快吧!所以Table可以很容易建立起结构化界面,通过table自身参数定义,我们能把页面布局很快定义成我们所需要效果。   ...

空空如也

空空如也

1 2 3 4 5 ... 8
收藏数 152
精华内容 60
关键字:

div布局和table布局的区别