Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[html] 第17天 你认为table的作用和优缺点是什么呢? #54

Open
haizhilin2013 opened this issue May 2, 2019 · 19 comments
Open
Labels
html html

Comments

@haizhilin2013
Copy link
Collaborator

第17天 你认为table的作用和优缺点是什么呢?

@haizhilin2013 haizhilin2013 added the html html label May 2, 2019
@hbl045
Copy link

hbl045 commented May 5, 2019

优点:写表格方便快捷,样式统一,居中对齐,减少使用div,seo较好
缺点:需要写的内容较多

@haizhilin2013
Copy link
Collaborator Author

@hbl045 不知道大家有没有经历过用table布局的年代

@hbl045
Copy link

hbl045 commented May 5, 2019

table布局接触过,是在做三栏布局的时候,两边等宽中间自适应。table在这个时候功能挺强大的,兼容性不错,除了写的多,几乎都没找到太多缺点。面对居中对齐更是便捷。

@tzjoke
Copy link

tzjoke commented May 29, 2019

为什么我觉得table不利于seo。。

@DarthVaderrr
Copy link

我觉得它没有优点

@Vi-jay
Copy link

Vi-jay commented Jul 26, 2019

缺点 容易导致回流

@Konata9
Copy link

Konata9 commented Jul 28, 2019

table 用于表格数据的展示,并且很符合人们的直观认知。

div+css 布局流行之前,普遍使用 table 进行布局。曾经的神器 Dreamweaver 的可视化拖拽也是基于 table 布局。

table 布局的好处在于样式好控制,特别是居中、对齐。缺点在于会多处非常多的 DOM 节点(想想一个 td 里面再来一个 table),会导致页面加载变慢、不利于 SEO(table 原本就不是用来布局的)。也因此,在 CSS 成熟之后,table 布局马上就变成历史了。

@hc951221
Copy link

hc951221 commented Aug 7, 2019

用table布局感觉好麻烦的样子

@Toeat
Copy link

Toeat commented Sep 11, 2019

优点:样式简单,构建方便,兼容良好,利于搜索
缺点:影响加载和渲染,维护麻烦,不利于css,影响用户拷贝

@blueRoach
Copy link

优点:特定的布局时,可以很块完成布局。
缺点:结构比较繁杂,相对于目前比较流行的布局来讲。如flex,div+css,grid等
作用:以前用来布局和展示表格,现在一般只用来展示表格

@undefinedYu
Copy link
Contributor

优点:结构简单,布局快速
缺点:如果对表格的渲染要求比较高时,就不够灵活。
例如:涉及冻结列,冻结行,表头固定等。就都需要配合其他标签再封装

@MrZ2019
Copy link

MrZ2019 commented Sep 15, 2020

优点:结构简单,布局快速
缺点:如果对表格的渲染要求比较高时,就不够灵活。
例如:涉及冻结列,冻结行,表头固定等。就都需要配合其他标签再封装

@buuug7
Copy link

buuug7 commented Jan 24, 2021

如果按照题目字面意思回答,table 就是一个普通的 HTML 元素,主要用来展示表格(二维)数据,至于优缺点,指的是什么的优缺点?违背table语义当布局元素使用?还是说这个HTML元素设计的有问题?该题目很含糊。至于有人使用它布局,最佳实践不建议这么做,因为违背了语义,冗余元素太多且不好维护。

看了上面的回答,大多数回答着都是把这个题目当作 你认为使用table布局的优缺点是什么呢? 来回答。建议把题目修改下。

@amikly
Copy link

amikly commented Nov 4, 2021

作用

table 用于表格数据的展示,符合人们的直观认知

在 div+css 布局流行之前,普遍使用 table 进行布局

优点

  • 简单易用:比较适合入门级的用户操作,用户可直接利用Dreamweaver工具栏插入表格,设置长宽、对齐方式、属性等。
  • 结构简单,布局快速:当用户插入一个TABLE的时候就可立即看到效果。
  • 可读性好:语句编写较为简便,主要代码就是<TABLE></TABLE><TR></TR><TD></TD>等语句
  • 开发速度较快:新建网站时,从Dreamweaver中直接拖入TABLE比编写DIV要快速很多
  • 兼容性较强:TABLE设计由来已久,得到浏览器的广泛支持,故显示效果很好,不会出现错位情况

缺点

  • 代码冗余,不利于 SEO:<TABLE><TR>``<TD><TD>``</TR>``< /TABLE>这是构成一个表格的最基本元素(此为一行一列的表格),相对<DIV></DIV>编写来说,代码繁多
  • 网页打开速度较慢:后台代码太多,,影响加载和渲染,导致网站打开速度慢

@tk12138
Copy link

tk12138 commented Dec 2, 2021

table可以用来布局,用于显示批量数据。早期使用table来布局网页,但是table有一个缺点,就是加载页面的时候,需要等全部的数据都请求到,才显示页面,否则就是一篇空白。因此现在不采用table做布局,而是使用div+css进行布局。
优点:特定的布局时,可以很快完成。
缺点:相对于目前比较流行的布局而言,结构比较繁杂。

@WangXi01
Copy link

没有经历过table布局,现代浏览器也不在意这一点点回流的性能影响,现在一般不关心这个了

@Iambecauseyouare
Copy link

优点:table写表格方便,样式统一,居中对齐,减少使用div
缺点:需要写的内容较多

@never123450
Copy link

表格(Table)是 HTML 中用于展示和组织数据的一种标记元素。它由行( <tr> )和列( <td> )组成,可以创建一个网格状的结构,用于呈现结构化的数据。

表格的作用和优点包括:

  1. 数据展示:表格是一种有效的方式来展示和呈现大量结构化数据,可以清晰地显示数据之间的关系和层次结构。

  2. 数据排序和过滤:表格通常提供了排序和过滤功能,使用户可以根据需要对数据进行排序和筛选,以便更方便地查找和分析数据。

  3. 数据对比:通过将相关数据放在同一行或同一列中,表格可以方便地进行数据对比和分析,帮助用户快速获取信息。

  4. 可访问性:使用正确的语义化标记和适当的 ARIA 属性,表格可以提供更好的可访问性,使屏幕阅读器和其他辅助技术能够正确解读和呈现表格内容。

然而,表格也有一些缺点和注意事项:

  1. 响应式布局:传统的表格在移动设备上可能不够友好,因为表格的宽度可能无法适应较小的屏幕尺寸。需要使用响应式设计或其他布局技术来解决这个问题。

  2. 复杂性和可维护性:当表格包含大量数据和复杂的结构时,它们可能变得难以维护和更新。需要仔细设计和组织表格的结构,以确保代码的可读性和可维护性。

  3. 可访问性需求:为了确保表格的可访问性,需要遵循一些指导原则,如添加适当的标题( <th> )、使用 scope 属性、提供摘要等。

总的来说,表格是一种强大的工具,可以有效地展示和组织数据。但在使用表格时,需要注意其布局、可访问性和维护性,以确保最佳的用户体验和可维护性。

@lili-0923
Copy link

优点:写表格方便快捷,样式统一,居中对齐,减少使用div,seo较好

缺点:需要写的内容较多

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
html html
Projects
None yet
Development

No branches or pull requests