html - 为什么要使用显示:table instead of table

标签 html css css-tables

用 div 构建我的网站并应用 display:table 属性(display:tr、display:tr)有什么好处。这是否意味着 div 的行为与 tr 和 td 元素完全一样?

我知道我可能根本不应该使用表格或表格行为来进行布局,但我只是想知道它们之间是否有区别和好处?

最佳答案

What's the benefits of structuring my site with divs and apply the display:table property ( display:tr, display:tr).

在我看来什么都没有,除了你 take away compatibility with older browsers .使用带有 display: table-* 的 DIV 的想法在某种程度上比 <table> 好s 是愚蠢的 IMO,是对表格元素完全错误的歇斯底里的结果。 (不是攻击你@Nimo,只是批评一些把“ table 是邪恶的”模因走得太远的人。)

表格应该用于表示表格数据,而不是被误用于布局。

但是,表格的某些功能仍然很难使用纯 CSS 来模拟。您要么需要大量黑客攻击,有时甚至需要基于 JavaScript 的变通办法才能使这些工作正常进行。

您应该以不依赖这些能力的方式设计您的布局。

在极少数情况下,您确实需要它们。但是,您是否使用适当的 <table><tr> 并不重要或脑死亡<div style="display: table"><div style="display: table-row"> (顺便说一句,哪个更语义化,可读性更好?)

如果您需要 display: table-*对于你的布局,你手头有一种罕见的情况,或者你已经把自己画在了一个 Angular 落里。无论哪种方式,使用 <table> ,您至少可以获得一致的浏览器支持。

关于html - 为什么要使用显示:table instead of table,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/2867476/

相关文章:

html - 如何在CSS中控制表格单元格的大小

css - 绕过 float 元素后定位 <li> 元素符号错误的 webkit 错误

javascript - 将刻度线添加到 nouislider jquery slider

html - 使用 css "display: table"属性复制的表格中的表格

javascript - angularjs如果在输入字段内单击则显示div,如果在输入字段外单击则隐藏

html - 如何将页脚 (div) 对齐到页面底部?

html - CSS3 动画文字颜色变化

css - 增加子菜单宽度

css - 底部对齐 Logo 和顶部对齐标题

css - 在 th、td 或两者上设置列宽?