table标签和div标签布局的优缺点

最新推荐文章于 2021-12-14 11:19:09 发布
最新推荐文章于 2021-12-14 11:19:09 发布
阅读量1.2k 收藏 2
点赞数
分类专栏： html
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_36339245/article/details/103078784
版权

table优点：开发时间短（使用DW开发速度快）；纯table各浏览器不会有兼容问题；内容可自适应；在搜索引擎排名能靠前

table缺点：如果布局变更，需要重新开发；如果table里有div ul 等，可能会出现浏览器兼容问题；加载速度慢；table套table，会让维护人员非常难受

div优点：内容和显示分离，便于维护扩展，网页布局方便，当需求改变的时候，效果最明显

柳宁依
关注
  • 0
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
table的缺点
m0_47137065的博客
01-06 535
1.太深的嵌套，比如table>tr>td>h3，会导致搜索引擎读取困难，而且，最直接的损失就是大大增加了冗余代码量 2.灵活性差，比如要将tr设置border等属性，是不行的，得通过td 3.代码臃肿，当在table中套用table的时候，阅读代码会显得异常混乱 4.混乱的colspan与rowspan，用来布局时，频繁使用他们会造成整个文档顺序混乱 5.不够语义 ...
DIV与Table两种页面布局方式的优缺点
weixin_34315189的博客
01-24 738
一、 TABLE方式优点：1、简单易用：比较适合入门级的用户操作，用户可直接利用Dreamweaver（以下简写为“DW”）工具栏插入表格，设置长宽、对齐方式、属性等。2、所见即所得：当用户插入一个TABLE的时候就可立即看到效果。 3、可读性好：语句编写较为简便，主要代码就是<TABLE></TABLE>、<TR></TR>、...
table布局的缺点
abbb5的博客
09-17 1741
Tables的缺点 1、Table要比其它html标记占更多的字节。(延迟下载时间，占用服务器更多的流量资源。) 2、Table会阻挡浏览器渲染引擎的渲染顺序。(会延迟页面的生成速度，让用户等待更久的时间。) 3、Table里显示图片时需要你把单个、有逻辑性的图片切成多个图。(增加设计的复杂度，增加页面加载时间，增加HTTP会话数。) 4、在某些浏览器中Table里的文字的拷贝会出现问题。(这会让用户不悦。) 5、Table会影响其内部的某些布局属性的生效(比如里的元素的height:100%)(这会限制你
前端面试题之HTML篇
爱是与世界平行
05-28 874
前端面试题之HTML篇1. src和href的区别2. 对HTML语义化的理解3. DOCTYPE(⽂档类型) 的作⽤4. script标签中defer和async的区别5. 常⽤的meta标签有哪些6. HTML5有哪些更新1. 语义化标签2. 媒体标签3. 表单4. 进度条、度量器5.DOM查询操作6. Web存储7. 其他7. img的srcset属性的作⽤？8. 行内元素有哪些？块级元素有哪些？ 空(void)元素有那些？9. 说一下 web worker10. HTML5的离线储存怎么使用，它的
table优缺点
shendeguang的专栏
01-28 2698
Tables的缺点  1、Table要比其它html标记占更多的字节。(延迟下载时间，占用服务器更多的流量资源。)  2、Tablle会阻挡浏览器渲染引擎的渲染顺序。(会延迟页面的生成速度，让用户等待更久的时间。)  3、Table里显示图片时需要你把单个、有逻辑性的图片切成多个图。(增加设计的复杂度，增加页面加载时间，增加HTTP会话数。)  4、在某些浏览器中Table
DIV与Table布局在大型网站的可用性比较
12-10
DIV与TABLE本身并不存在什么优缺点，所谓web标准只是推荐的是正确的使用标签，好比说：DIV用于布局，而TABLE则本来就是转二维数据的。让TABLE做该做的事，并不是说页面里不出现TABLE就是多么多么牛。 　DIV是标准，...
html5 div布局与table布局详解
09-27
HTML5中的布局方式主要有两种：div布局和table布局。这两种布局方法各有特点，适用于不同的场景。下面我们将详细探讨这两种布局的异同。 首先，我们来看div布局。Div布局是基于HTML元素`<div>`（定义文档中的分区或...
页面设计中table和div的合理应用简要说明
09-22
在网页设计领域，table和div是两种常用的布局工具，它们各有优缺点，合理应用能有效提升页面的可读性、可维护性和搜索引擎友好性。在早期的网页设计中，table曾是主流的布局方式，但随着HTML5和CSS的普及，div+CSS...
浅谈 div 与 table 如何取舍结合利用
09-22
在网页布局设计中，`div` 和 `table` 是两种常用元素，各有其优缺点，适用于不同的场景。本文将深入探讨两者如何根据实际需求进行取舍和结合利用。 首先，`table` 元素在早期网页设计中广泛用于布局，因为它们能够...
html中Div与table的区别(各方面细节探讨)
09-22
综上所述，Div和Table各有优缺点，选择哪种布局方式取决于具体项目的需求和目标。在追求Web标准和响应式设计的今天，Div布局更受欢迎，但在内容主导的大型网站中，Table布局仍有一定的实用价值。关键在于合理利用...
Table布局的优缺点介绍及为什么不建议使用
09-22
Table布局的缺点是比其它html标记占更多的字节，会阻挡浏览器渲染引擎的渲染顺序，会影响其内部的某些布局属性的生效，优点就是用table做表格是完全正确的
css之前端5种布局方式之table布局、float布局、absolute布局、flexbox布局、grid布局
sinat_38778794的博客
12-14 1105
1.表格布局（不推荐） 父级容器为display：table 表格 子级容器为display：table-cell 一个单元格 特点：在没有特别设置的情况下，子级是自动平分宽度并填满父级的。 table布局的优缺点： 缺点 1.table所占的字节比起其他的html标签来说更多，并且占用服务器资源更多，下载更慢。 2.table布局一旦形成，后期就很难用css改变。 3.阻挡浏览器渲染引擎的渲染顺序，延迟页面生成速度。 4.不利于搜索引擎抓取信息，影响网站排名。 优点： 兼容性高
html中表格布局还是div布局,Table布局 VS Div+CSS布局，选哪个？
weixin_36235398的博客
06-10 716
Table布局 和 Div+CSS布局的争论，过了7-8年了，今天看到一篇文章《为什么我们不建议用Table布局》，又想发表下自己的见解，供初学《为什么我们不建议用Table布局》节选：Table要比其它html标记占更多的字节。(延迟下载时间，占用服务器更多的流量资源。)Tablle会阻挡浏览器渲染引擎的渲染顺序。(会延迟页面的生成速度，让用户等待更久的时间。)Table里显示图片时需要你把单个...
table和div的优缺点
学习笔记
04-08 2238
 和webpage打交道起页面布局就一直是我关注的内容，从早期table构架页面到DIV再到DIV＋Table，可以说我们的需求一直在变，但是目 的一直没有改变。为什么这么说，很明显从简单到复杂，再从复杂到简单；从简单运用到复杂运用；一切都是围绕需求性来做的。很多开发设计人员在从事页面布局 开发的时候都要考虑到几点：布局是否合理，结构是否紧凑，是否有充分的扩展性，可读性是否强。而合理使用Table
table的作用以及优缺点
u014395826的博客
01-07 6036
Tabale标签 table的主要作用： 用于布局（过时）用于显示批量的数据 早期的使用table来布局网页，但是table有一个缺点，就是加载页面的时候，需要全部的数据都请求到，才显示页面，否则就是一片的空白。因此现在一般不采用table来做布局，而是使用div+css进行布局。 table的结构：
DIV+CSS布局和TABLE布局的优缺点讲解
elsyy良师益友的博客
12-18 1万+
TABLE布局是WEB早期CSS不存在的时候兴起的，是对TABLE标签的不正规使用，Table标签就是表格，是用来显示数据的，而不是用来布局网页的，虽然它有时候布局网页很简单。现在绝大多数的网站都是用DIV+CSS布局。这两种布局各有各的优点。 一、div+css布局的好处： 1.符合W3C标准，代码结构清晰明了，结构、样式和行为分离，带来足够好的可维护性。 2.布局
table和div布局优缺点
曾子墨
05-30 1万+
由于html文件中的table标签的浏览速度较慢，所以，使用嵌套表格的方法来布局网页框架会使网页浏览的速度变慢。因为table是中的内容是自适应的，为了自适应，它要计算嵌套最深的节点以满足自适应，所以有可能会有一断时间出现空白才显示。所以是会有问题的。        使用DIV的方法布局网页框架的优点：可以通过css样式给框架进行功能强大的属性设置以及给网页的局部进行任意的定位，制作出来的页面浏
HTML中表格布局的优缺点
热门推荐
老杨的博客
09-04 1万+
缺点: 1、 标签结构多，复杂  我们可以从表格的结构来看        内容1     从上面表格的结构标签来看，标签的对数较多，在表格布局中，主要是用到表格的相互嵌套使用，这样就会造成代码的复杂度更高！  2、 表格布局，不利于搜索引擎抓取信息，直接影响到网站的排名 优点: 1、结构位置更简单  2、容易上手  3、 数据化的存放更合理。 例如，学生信息这样的表
为什么不建议用table进行布局
Screener的博客
07-03 1万+
本文部分内容转载自:http://www.html5tricks.com/why-not-table-layout.html刚刚接触html的时候,利用table进行页面布局是比较容易的。但是,在实际的项目开发过程中,我们不建议用table进行布局,原因如下:table比其它html标记占更多的字节。(造成下载时间延迟,占用服务器更多流量资源)table会阻挡浏览器渲染引擎的渲染顺序。(会延迟页面...
js通过正则将table标签替换为div
最新发布
06-13
可以使用JavaScript的replace方法以及正则表达式来实现将table标签替换为div标签。 如下代码所示： ```javascript var html = '<table><tr><td>表格内容</td></tr></table>'; // 将table标签替换为div标签 ...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值