Question

如果这是结构：

<table cellspacing="0" cellpadding="0">
   <tr>
      <td>I don't need anything here, should I always put a &nbsp; here?</td>
      <td>item </td>
   </tr>
   <tr>
      <td>model</td>
      <td>one</td>
   </tr>
   <tr>
      <td>model</td>
      <td>two</td>
   </tr>
   <tr>
      <td>model</td>
      <td>three</td>
   </tr>
</table>

屏幕阅读器如何读取空白td？它在语义上是否正确？

Answer 1

语义正确的恕我直言将保持空单元真正为空。但是，出于实际原因，我也用 填充空单元格。

对于屏幕阅读器，我必须做出有根据的猜测：可能无法读取空节点，因为HTML主要由空白文本节点组成，读者忽略了这一点，我认为 是折叠到阅读器应用程序中的简单空间（因为不间断是视觉媒体的属性）。

为了直观呈现，可以依赖CSS表格属性empty-cells：

table {
    empty-cells: show;
}

Answer 2

从语义上讲，HTML表实际上只是数据的数组（矩阵），并且没有理由不将不间断空格字符视为数据。它是否真正有意义取决于表的目的，结构和内容。在大多数情况下，有一个更好的解决方案。请参阅Empty cells in HTML tables中的一些建议。

在技术方面，不间断空间具有宽度和高度，具体取决于字体，这对单元的尺寸施加了最低要求。这可能很重要，但主要是在行或列仅用作分隔符的情况下，例如，创建水平或垂直线。

使用不间断空间的另一个影响，与使用普通空间或使单元格完全为空相反，可能会影响单元格周围边框的外观以及单元格内的背景颜色和背景图像。 / p>

屏幕阅读器在指示空单元格的方式上有所不同，如果有的话，这也可能取决于读取模式。在任何情况下，用户都没有得到真正发生的事情的指示，即什么是空单元（如果空白被传达给用户）意味着什么。在视觉浏览中，意义可能（或可能不）显而易见。

Answer 3

感谢像Dreamweaver这样的编辑，这种做法变得有些标准，所以即使它不是一个完美的解决方案 - 至少你不会孤军奋战。此外，它与旧版浏览器的兼容性高于CSS empty-cells。

Answer 4

没有任何确切的说明你不应该使用空白的TD，当你尝试验证它时会通过。

虽然更优雅的方法是使用colspan。

即

<tr>
   <td colspan="2">item </td>
</tr>

但是这会使您的内容与左侧对齐，您必须手动（通过CSS）应用样式，以便内容在您想要的位置对齐。

与colspans一起使用它的好处是屏幕阅读器只能读取那里的内容，而不是空白空间

把一个空的内部放在一边好吗？

4 个答案: