Div与table的区别

【Cadence】 ADS Dynamic Link使用教程 在Cadence617上使用ADS Dynamic Link 阅读详情

1:速度和加载方式方面的区别

div 和 table 的差异不是速度,而是加载方式,速度只能是指网络速度,如果速度足够快,是没有差异的:

div 的加载方式是即读即加载,遇到 <div> 没有遇到 </div> 的时候一样加载 div 中的内容,读多少加载多少;table 的加载方式是完成后加载,遇到 <table> 后,在读到 </table> 之前,table 中的内容不加载,或者传输中断了(document.onload()事件)的时候加载,这是因为TABLE牵涉到多行多列问题,所以只有当TABLE所有内容加载完毕,IE才知道该怎么显示

2:在网页应用中的差别

如果页面首尾加 table ,那么必须等整个页面读完了才加载

如果页面首尾加 div ,无任何影响

 

3:DIV与Table布局在大型网站的可用性比较

DIV与TABLE本身并不存在什么优缺点,所谓web标准只是推荐的是正确的使用标签,好比说:DIV用于布局,而TABLE则本来就是转二维数据的。让TABLE做该做的事,并不是说页面里不出现TABLE就是多么多么牛。

用DIV进行排版的优势就是我不说,大家应该都比较清楚。DIV是标准,是大势所趋,但并不意味着所有的页面都适合用它来做。

中国的门户和国外的有很大的区别,中国网民并不喜欢信息量少的页面,YAHOO到了中国页面上的内容就多了不少,而上次改为简洁的页面后访问量下降的厉害以至于没过几天就又改了回来。正式由于中国的国情造就了搜狐、新浪这样门户。

为什么DIV不适合他们?下面我从几个方面来逐一说明:

精简代码:

大家都说DIV的布局精简代码,但是用DIV替代TABLE所节约的代码又被CSS(样式)所占用,而这些样式大多用于控制DIV的排版布局。那你会说了,CSS可以放在外部重用啊,要想得到这个问题的答案请往下看。

重用性与下载量:

统一使用一个.css的样式表文件,可以实现修改一次,全站修改的效果,这样使得维护的成本更低。但是请大家换一个角度想,如果所有页面在加载时都要访问一个文件,那这个文件每天的下载量,特别时在搜狐、新浪的网站平台上将达到几亿次,这就需要后面有很多台前端web服务器在做支撑,那后台的成本无形中也提高了很多。如果后台支撑没有做好,那么页面就会出现花屏,之前所作的工作也是白费。很多人会问,这样的几率太小了。我们所作的工作就是为了避 免这一两次意外的发生,如果意外发生了,对于门户后果将是不堪设想的。

HTTP通讯:

统一的样式表文件采用外部调用的形式,这样每次加载单个页面都会多一次对服务器的http请求服务器都会增加一次响应,这样对前端web服务器 会是很大的消耗。而原来很长时间都是将css和js写在页面前端(大家可以看看sohu和sina的页面,大多都是采用这样的形式),而不是作为外部调用 的形式,也是为了尽量避免给服务器增加消耗。

页面缓存:

每次用户访问的页面,都会在浏览器缓存中保存一定时间,以保证用户下次再访问该页面时能够大大提高页面显示速度。而每次修改都会使页面重新下载,对于每个外部导入的样式文件也是如此,如果CSS文件修改,那么访问网站的每一个页面都会重新下载,而以往的将样式写在页面中的方式,只是修改的页面需要重新下载。

兼容性:

对于CSS(样式表)并不是所有浏览器的所有版本都支持的很好,比如IE5以前的浏览器对于CSS的支持就不是很好。而现在使用IE5以前版本 浏览器的用户不在少数,这样就使得在页面制作的过程中需要针对不同浏览器版本进行测试,以保证兼容性,无形中也增加很多工作量(至少我接触的开发人员制作 div页面比table页面的标准时间要长一些)。

横切与延展性:

横切——传统的布局方式为了使页面下载的更快,把页面自上而下分成若干个块,但是往往采用DIV进行布局的页面都会出现这样的情况,由于每块中间栏或者其他栏内容条数不固定导致两边栏目没有同时自适应,而出现留白。

以上我们只是讨论某一技术在某一领域的可用性,而非技术本身。

说了这么多并不是说DIV这种布局方式不好,而是说我们应该正确的看待Table在以内容为基础的大型门户中的作用,而不是人云亦云。之所以 DIV的布局方式没有在大型网站应用,不是说门户没有用DIV是技术落后,是里面的人没有前瞻性,而是多种原因决定的。网易之所以全部采用DIV的方式是因为内容并不是他们主攻方向。而对于其他门户来说,这样的决策是要靠时间来验证的。只是现在这个时机还不成熟而已。

 

4:DIV+CSS

而现在我认为DIV +CSS并不是字面上的含义那么简单,而有两重内在含义:

1、结构与表现分离,用DIV完成结构,用CSS控制表现,这样带来的好处非常多,DIV精简了页面,提高了灵活性。而精通CSS的设计师能避免DIV的重复嵌套,从而大大提高页面加载速度,以及站点的可以维护性。

2、选用DIV 来配合CSS的原因,CSS 的核心是 “盒子模型”,而没有哪个标签能比DIV更好的诠释“盒子模型”的精髓,TABLE的结构过于复杂,并不能很好的做到这一点,虽然TABLE+CSS也是一种选择,但别忘了DIV还有另外一个优势,浮动层叠,而且用TABLE进行布局的网站是不能通过W3C验证的。

其实DIV的好处还远远不止这些,例如弹性布局,用户自定义布局,DIV都展现出不可思议的灵活性,而富有语义的结构对搜索引擎的友好度也比TABLE要来的高,更不用说跨平台的应用。DIV+CSS为我们提供了一个优雅而规范的技术框架,让我们能用最少的重复劳动,完成更多更美观的页面,从而提升整个团队的效率,甚至改变长期以来网页设计师与网页程序员无法同步工作的问题。

LAMMPS实战指南 - 从in文件到分子动力学模拟的完整流程解析 本文详细解析了LAMMPS分子动力学模拟的完整流程,从理解in文件的核心作用与基础结构开始,逐步指导如何创建模拟体系、选择势函数、进行能量最小化与初始化,并深入讲解了NVT/NPT系综弛豫与生产模拟的关键步骤。文章还提供了常见问题的避坑指南与实战技巧,帮助初学者快速掌握从编写in文件到成功运行模拟的全过程。 阅读详情

相关推荐

离线反激转换器反馈环路设计:从理论到实践的Type II补偿器详解

在开关电源设计中,反馈环路稳定性是决定电源性能与可靠性的核心。其本质是通过补偿网络对功率级的小信号特性进行校正,以构建一个具有足够相位裕度和增益裕度的闭环系统。反激转换器作为一种广泛应用的隔离拓扑,其功率级在连续导通模式(CCM)和非连续导通模式(DCM)下呈现不同的零极点特性,这直接决定了补偿器的选型。Type II补偿器因其传递函数中固有的积分环节、低频零点与高频极点,恰好能与反激功率级的1P2Z(一个极点、两个零点)特性形成互补,有效塑造理想的回路增益曲线,实现快速稳定的动态响应。本文聚焦于采用TL4

weixin_30162121的博客 502

Div 与 table 的区别

1:速度和加载方式方面的区别 div 和 table 的差异不是速度,而是加载方式,速度只能是指网络速度,如果速度足够快,是没有差异的: div 的加载方式是即读即加载,遇到 没有遇到 的时候一样加载 div 中的内容,读多少加载多少;table 的加载方式是完成后加载,遇到 后,在读到 之前,table 中的内容不加载,或者传输中断了(document.onload()事件)

newnazi的专栏 1082

ipc$漏洞攻击(实验)

我们总在说ipc$漏洞ipc$漏洞,其实,ipc$并不是真正意义上的漏洞,它是为了方便管理员的远程管理而开放的远程网络登陆功能,而且还打开了默认共享,即所有的逻辑盘(c$,d$,e$……利用IPC$,连接者甚至可以与目标主机建立一个空的连接而无需用户名与密码(当然,对方机器必须开了ipc$共享,否则你是连接不上的),而利用这个空的连接,连接者还可以得到目标主机上的用户列表(不过负责的管理员会禁止导出用户列表的)。5.然后,我们物理连接到靶机上,到了两分钟后,我们可以用命令看到,这个pp45的用户就出现了。

2301_76361674的博客 3255

DIV与TABLE的HTML布局

DIV布局 div标签是块级元素,本身没有意义,用于其他元素的容器,由于div自带折行效果,因此div默认是列排列 // 两个div默认列排列 <html> <head> <meta charset="utf-8" /> <title></title> </head> <body> <div style="background-color: black; width: 100px ; height

个人学习笔记库,一篇一篇记录成长的足迹 1637

Android GNSS 模块分析(三)JNI 层

Android GNSS;定位服务;GPS;NMEA协议;LocationManagerService;导航;

Yang_Mao_Shan的博客 5161

OpenCV 开闭运算

开运算和闭运算是将腐蚀和膨胀按照一定的次序进行处理。 但这两者并不是可逆的,即先开后闭并不能得到原来的图像。 开运算 开运算是先腐蚀后膨胀,其作用是:分离物体,消除小区域。特点:消除噪点,去除小的干扰块,而不影响原来的图像。 闭运算 闭运算与开运算相反,是先膨胀后腐蚀,作用是消除/“闭合”物体里面的孔洞,特点:可以填充闭合区域。 cv.morphologyEx(img, op, kernel) img: 要处理的图像 op: 处理方式:若进行开运算,则设为cv.MORPH_OPEN,若进行闭

꧁༺ʚvv༒catɞ༻꧂的博客 949

HTML中的div布局与table的区别

同样的效果,使用 div 布局能比表格更加灵活,但是我们需要根据不同的场景使用不同的布局方式,现在我们来看看两种布局的优缺点。样式的调整更加方便,内容和样式的分离,使页面和样式的调整变得更加方便。表现和结构分离,在团队开发中更容易分工合作而减少相互关联性。一个页面可能会有大量的 table 元素,代码冗余度高。不同的浏览器看到的效果一般相同。显示样式和数据绑定在一起。搜索引擎不喜欢这样的布局。节省代宽,代码冗余度低。布局的时候灵活度不高。符合 W3C 标准。

weixin_54018753的博客 827

Google Earth Engine(GEE)——MOD09A1/MOD11A2/MOD13A1不同的QA波段去云进行分析

​​​​​​​大多数光学卫星图像产品都带有一个或多个 QA 波段,允许用户评估每个像素的质量并提取满足其要求的像素。QA 波段最常见的应用是提取有关多云像素的信息并对其进行屏蔽。但是 QA 波段包含大量其他信息,可以帮助您从分析中删除低质量数据。通常,QA 频带中包含的信息存储为按位标志。在这篇文章中,我将介绍与位运算相关的基本概念,以及如何使用位掩码提取和屏蔽特定的质量指标。

此星光明博客 4576

Div与table的区别(2)

1:速度和加载方式方面的区别 div 和 table 的差异不是速度,而是加载方式,速度只能是指网络速度,如果速度足够快,是没有差异的: div 的加载方式是即读即加载,遇到 没有遇到 的时候一样加载 div 中的内容,读多少加载多少;table 的加载方式是完成后加载,遇到 后,在读到 之前,table 中的内容不加载,或者传输中断了(document.onload()事件)的时候加

泪光无悔 753

26、特洛伊木马:威胁与防范

本文详细介绍了多种常见的特洛伊木马,包括RegForm、ProMail和远程访问特洛伊木马(RATs),并分析了其工作原理与危害。重点讲解了著名RATs如Back Orifice、SubSeven和The Thing的技术特点,揭示了黑客编写特洛伊木马的常用语言与方法。同时,提供了有效的防范策略,如谨慎获取软件、使用回滚程序、杀毒软件、防火墙及反特洛伊木马程序,并通过流程图展示了防御机制。旨在帮助用户识别威胁并加强系统安全防护。

e3f4g5的博客 88

【Mode Management】AUTOSAR架构下RH850-F1KM芯片深度休眠配置实践

AUTOSAR架构下RH850-F1KM芯片深度休眠配置实践

qq_36056498的博客 1091

html css div开发table表格

html css div开发类似table表格

bluemengcom的博客 1498

AI上推荐 之 协同过滤

㐇

Miracle8070 1万+

java div和table_Div与table的区别

1:速度和加载方式方面的区别div 和 table 的差异不是速度,而是加载方式,速度只能是指网络速度,如果速度足够快,是没有差异的:div 的加载方式是即读即加载,遇到 没有遇到 的时候一样加载 div 中的内容,读多少加载多少;table 的加载方式是完成后加载,遇到 后,在读到 之前,table 中的内容不加载,或者传输中断了(document.onload()事件)的时候加载,这是...

weixin_35995835的博客 211

数学建模模型总结

这是本人在两年内准备参加数学建模竞赛搜集到的模型资料,已经经过了本人的筛选和整理,希望能够对准备参加数学建模竞赛的学弟学妹们提供一些帮助!

精雕软件(JDpaint) 5.5 绿色版

精雕软件(JDpaint) 5.5 绿色版精雕软件(JDpaint) 5.5 绿色版精雕软件(JDpaint) 5.5 绿色版

div与table的区别

div 和 table 的区别是加载方式。 div的加载方式是即读即加载,遇到,没有遇到的时候,一样加载div中的内容,读多少加载多少。 table的加载方式是完成后加载,遇到后,在读到 之前,table 中的内容不加载,或者传输中断了(document.onload()事件)的时候加载。 如果页面首尾加table,那么必须等整个页面读完了才加载。 如果页面首尾加div ,无任何影响。

千分之想 934

IEM模型,地表粗糙度模拟

利用微波反演土壤水分时候,利用IEM模型可以实现对随机地表的模拟

浅谈table布局和div布局的区别

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

weixin_43846755的博客 2081

LinePhone3.2.7(android端最新版本) sip客户端

SIP客户端For android:LinePhone3.2.7(最新版本),官网地址:http://www.linphone.org/

div和table页面布局的区别

    现在对于网页制作是选择传统的TABLE还是用新型的DIV,有分歧。一部分说还是用TABLE好,开发快,容易控制,浏览器兼容也好些;另一部分认为DIV好,以后的发展趋势,,主要是如下原因:div+css布局比table布局节省页面代码,代码结构也更清晰明了。div+css开发速度要比table快,而且布局更精确,不过手写代码明显增加div+css布局,使网站版面布局修改变的更简单。

csj50的专栏 2175

div 与 table的区别

DIV与TABLE本身并不存在什么优缺点,所谓web标准只是推荐的是正确的使用标签, 好比说:DIV用于布局,而TABLE则本来就是转二维数据的。让TABLE做该做的事,并不是说页面里不出现TABLE就是多么多么牛。 用DIV进行排版的优势就是我不说,大家应该都比较清楚。DIV是标准,是大势所趋,但并不意味着所有的页面都适合用它来做。 中国的门户和国外的有很大的区别,中国网民并不喜欢信息量少

张晓丛的专栏 2405

Div和Table的区别

Div与table的区别 1:速度和加载方式方面的区别 div 和 table 的差异不是速度,而是加载方式,速度只能是指网络速度,如果速度足够快,是没有差异的: div 的加载方式是即读即加载,遇到 <div> 没有遇到 </div> 的时候一样加载 div 中的内容,读多少加载多少;table 的加载方式是完成后加载,遇到 <table> 后,在读到 ...

weixin_30448685的博客 121

table 和 div+css 的区别

table 和 div+css 的区别 ==table:==加载方式是完成后加载,遇到 后,在读到 之前, 中的内容不加载;布局受到限制。div::加载方式是即读即加载,遇到 没有遇到 的时候一样加载 中的内容,读多少加载多少;布局更加灵活。 ...

qq_44716411的博客 202

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

本文向大家描述一下DIV和Table页面布局的区别和联系,一般来说Table开发快,容易控制,浏览器兼容也好些,至于DIV的优势请看下文详解。   DIV和Table页面布局的区别和联系   现在对于网页制作是选择传统的Table还是用新型的DIV,有分歧。一部分说还是用Table好,开发快,容易控制,浏览器兼容也好些;另一部分认为DIV好,以后的发展趋势,主要是如下原因:   DIV+CS...

web开发自学 96

html中table的画法及table和div的区别

    最近项目中,根据客户的要求需要在页面上展示各种报表什么的,各种表格的都会出现。这里也将table的画法,做一下总结。办法虽笨但很实用。这也是从高人那里学来的,总之是屡试不爽啊。就以下面的表格为例。          若想画上面的表格,首先得确定是几行几列的。怎么确定?       总之,不管三七二十一,出现横线的地方画一红横线,出现竖线的地方画一竖线分割,如上图所示,已基本确定...

weixin_33712987的博客 141
上一篇: 英语四级万能模板
下一篇: 什么是伪静态?SEO中如何理解伪静态?
郭晓湉
郭晓湉 领域专家: 前端开发技术领域 领域专家: 前端开发技术领域
博客等级 码龄15年 341粉丝 302原创
评论 2
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值