Question

我有一个空表行，只是为了分隔行。

<tr>
  <td colspan="5"></td>
</tr>

它在IE，FF，Opera和Safari中呈现。问题是，我是否应该在其中加入一些内容，或者可以保留原样？

像：

<tr>
  <td colspan="5">&nbsp;</td>
</tr>

Answer 1

您可以将 作为列内容以确保显示行。更好的方法是使用CSS进行间距。

Answer 2

从语义上讲，空行是有用的，还是纯粹用于布局？如果是后者，可能值得考虑删除空行，并通过CSS提供分离。 E.g。

<tr class="separate-below">
    <td>Data before separater</td><td>More Data</td>...
</tr>
<tr>
    <td>Data after separater</td><td>More Data</td>...
</tr>

样式表中包含以下内容：

TR.separate-below TD,TR.separate-below TH {
    border-bottom: 1em solid white; /* use the background colour of a cell here */
}

或者，您可以使用多个＆lt; tbody＆gt;将行块组合在一起的元素（将rules =“groups”添加到table元素会导致＆lt; tbody＆gt;元素在顶部和底部获得水平边框，并使用＆lt; colgroup＆gt;元素获取其左右边框）：

<table rules="groups">
<thead>
    <tr><th>Header</th><th>Header</th>...</tr>
</thead>
<tbody>
    <tr><td>Data</td><td>Data</td>...</tr>
    <tr><td>Data</td><td>Data</td>...</tr>
    ...
</tbody>
<tbody>
    <tr><td>Data</td><td>Data</td>...</tr>
    ...
</tbody>
...
</table>

Answer 3

正如您在W3Schools this example中使用 所看到的那样，这是实现目标的最佳方式。

Answer 4

如果你想把内容放进去，我会使用一个不间断的空间： ，而不是一般的空白

Answer 5

这是一个非常古老的问题，但如果有人仍需要解决方案（display: table-cell或table-row elements存在问题）

这是解决方案：

.emptyElement:after{
  content: "\00a0";
}

Answer 6

我想添加我的解决方案，这是对@Dariusz Sikorski解决方案的修改。

td:empty:after, th:empty:after {
  content: "\00a0";
}

Answer 7

您可能已经尝试过此操作，但如果您尝试在行之间添加一些空格，则尝试添加一些填充。

CELLSPACING =长度（单元格之间的间距）

CELLPADDING =长度（单元格内的间距）

卡尔

Answer 8

为确保显示空单元格，可以使用以下CSS：

table { empty-cells:show; }

Answer 9

您可以使用多个tbody标记对表格行进行分组。它完全有效且更具语义性。

如果所有单元格都为空，是否会显示表格行？

9 个答案: