html - 使用嵌套列表而不是表格在 HTML 中显示数据

Question

我不使用 HTML 表格，而是考虑使用嵌套列表结构来显示类似表格的数据。

例如:

<div class="table">
   <ul class="row">
      <li class="cell col-id"></li>
      <li class="cell col-name"></li>
      <li class="cell col-age"></li>
   </ul>
</div>

我的理由:

• 比 trs 和 tds 更舒适的样式 block 元素。
• ul/li 元素在样式选项、使用 JQuery 等方面似乎更灵活。
• 表格不是很重并且一次渲染吗？

另一方面，我看不出使用 HTML 表格有任何优势。

我在这里离基地很远吗？如果是这样，请解释使用 HTML 表格的好处，因为我似乎不记得了。

Answer 1

对我来说，这与使用表格布局网页没有什么不同。您通过使用 ul 表示表格数据来破坏页面的语义。以下并非详尽无遗的列表，但强调了我坚持使用表格的一些原因:

1. 如果有人在关闭 CSS 的情况下浏览您的页面，列表将不会保留表格的外观并且难以解释

2. 屏幕阅读器将无法识别这些表格，从而导致可访问性问题。此外，这并不重要，但如果有人想直接从您的站点解析您的数据，他们将不得不弄清楚您的列表格式。

3. 您会失去 thead、tfoot 和 tbody 的一些好处。在我脑海中，thead 的一大好处是，如果您打印一个跨多个页面的表格，thead 中的标题将显示在表格行上方的每一页上。

4. 如果您决定使用 WYSISYG 编辑器，您将无法使用某些表创建向导。

5. 如果其他人将来必须维护您的网站，他们将必须学习这个新系统的细节来表示表格数据。

这些只是使用表格的几个论点。

如果您决定使用列表解决方案，我只是想祝您好运，并且有兴趣看看它是如何工作的。