4

任何人都可以向 css/html 学习者解释为什么我会<div>使用 display:table 而不是简单地使用 HTML table 标记来设置通用 html 元素（例如）的样式吗？在我看来，后者是可以选择的，因为它是专门为呈现表格数据而实施的，但我知道没有充分的理由就不会出现前者。我只是无法找到一个体面的解释。我通常相当可靠的朋友，谷歌在这方面无法为我提供太多帮助。

先感谢您！尼尔

4

3 回答 3

2

display:table,display:table-row并被添加为分别用作,和display:table-cell的默认display属性。<table><tr><td>

在它们的默认值之外，它们通常用于诸如垂直居中文本或伪元素 clearfixing 之类的 hack 。除非您需要其中一种技巧，否则基本上不要这样做，尤其是如果您想实现一个表，则不要这样做，因为它在语义上不正确，会导致可访问性问题。

警告一句，使用 display:table 在某些屏幕阅读器中具有语义效果。这可能会导致您网站中的某个部分对使用辅助技术的用户具有多种含义。

于 2013-03-23T03:41:22.830 回答
0

不使用 HTML 表格而是构建 CSS 表格的原因有很多。但首先，请查看您网站的统计信息以及您需要支持的浏览器。您可能需要支持使用不支持 display:table 的旧浏览器的访问者 - 例如 IE7 http://caniuse.com/#search=display%3Atable

使用 CSS 表格的一个原因是将格式与内容分开。如果您想在以后将数据操作到另一个结构中，则必须替换所有表格代码，而不仅仅是调整 CSS。

另一个原因是使表格数据具有响应性。如果它是 div 比它是一个 HTML 表格，你可以对数据有更多的控制。您可以选择将内容重新包装为列表，或者隐藏、显示、滚动、截断...您认为合适的内容。虽然 HTML 表格仍然可以实现其中的一些，但并非全部都可以。

于 2013-03-23T03:46:31.587 回答
0

有几个原因，包括以下几点：

  1. 使使用表格布局设置 XML 文档的样式成为可能。CSS 不仅仅适用于 HTML。
  2. table以CSS 术语记录 HTML 元素的默认呈现。
  3. 使使用例如div元素标记的数据可以使用（简单）表格布局。
于 2013-03-23T06:44:28.323 回答