html - 将 div 设置为表格，可以接受吗？

Question

我正在开发一个模板，并且我知道使用 CSS 比使用 HTML 表格进行定位更好......但是，在我的 div 上获得两全其美并使用类似表格的样式是否可以接受？例如：

display: table;

这不仅可以帮助我解决粘页脚问题，还可以避免与浮动相关的痛苦。不确定这是否会被视为丑陋的黑客或雄辩的解决方案。想法？

score 1 · Accepted Answer

丑陋的黑客...您可以使用clearfix方法处理浮动，并且有大量的粘性页脚技术（例如这个）可以使用。

如果这是一个问题，display: table IE7 及以下版本也不支持。

您应该继续为您的布局使用更新的语义元素 - header，section，footer等，并在您只想显示一些表格数据时使用table -s。

score 1 · Accepted Answer

我个人认为使用display: table. 我不建议广泛使用它，但有时它对于以您想要的方式显示某些内容非常有用，而无需添加一堆额外的 HTML 或处理繁琐的 CSS 规则以使某些内容看起来像您想要它。

如果它适用于您在开发中针对的客户端浏览器，并且可以在其他领域为您节省痛苦或复杂性，那么请随意使用它。

score 1 · Accepted Answer

没有理由害怕或厌恶display: table。是的，值是table，但它是公平的游戏并且完全有效的 CSS 2.1。

表格在标记中是“不好的”，因为它们被滥用和应用的方式没有反映其预期的语义目的，即呈现表格数据。如果您有表格数据，那么不使用表格与使用表格进行布局一样大。

让我们回到主题。在 IE < 8 中支持display: table有点不稳定，在 Android < 2.1 和 iOS < 3.2 中不存在。如果您需要支持这些，请使用float.

此属性最简单的用途是应用于display: table父元素、子元素display: table-row和孙子元素display: table-cell。如果您在任何级别偏离这一点，结果可能会有点奇怪。（我对此有个人经验。）如果您遇到困难，请查看 CSS 表格模型的 W3C 规范。

来源：
http ://caniuse.com/css-table
http://www.w3.org/TR/CSS21/tables.html#table-display

score 0 · Accepted Answer

这取决于。虽然 CSS div 是 HTML 中任何事物的最佳解决方案（除非您需要 IE6 支持...），并且表格（就标记而言）正在成为一项古老的技术，但一方面它可能会想出最曾经做过的关于 CSS 的残障和愚蠢的解决方案，另一方面，您可以在没有单个 div 的情况下创建 HTML 杰作。

因此，如果您认为自己的 CSS 足够好，请使用它。如果您不确定，或者您是真正的表格大师，表格应该可以完成工作。

score 0 · Accepted Answer

我个人从未使用过display: table，但这个链接似乎非常精通语法。

我通常坚持使用花车，在阅读完这篇文章后，可能会给display: table一个机会。当我使用浮点数时，我必须使用某种clear: bothdiv 来跟进它。display: table似乎是解决该问题的更有效和可接受的解决方案。

score 0 · Accepted Answer

如前所述，表格非常适合表格数据。当您获取大量动态数据时，我也喜欢使用表格。对于模板开发，我会坚持使用 CSS。

6 回答 6