html - 不显示空表格单元格

Question

我正在尝试创建一个空单元格表，我在上面附加了 Javascript 以切换类，所以我只需要给它们一个高度和宽度。问题是当我创建表格时，虽然它有填充，但我无法让它保持高度。我尽量避免使用  ，因为当我这样做时，它会创建突出显示文本的鼠标悬停，并且多次单击该框可以选择文本。

网上查了一下，empty-cells: show; 是常有的答案，但是好像没有保持高度。我考虑过将其作为一系列内联 block div 来实现，但随后边框变得凌乱，因为边框不会折叠。

我真的只有一张空 table

<table style="border-collapse: collapse; empty-cells: show;">
    <tr>
        <td style="height: 1.3em; padding: 4px 6px;"></td>
        <td style="height: 1.3em; padding: 4px 6px;"></td>
    </tr>
</table>

我觉得这是一个古老的 HTML 问题，我缺少一些简单的答案。

我曾看到被建议为重复的问题，但由于答案已有 5 年历史，我认为必须有更现代的方法来解决这个问题。如果没有，我猜 visibility 技巧是可行的方法。

Answer 1

是否有您想要的特定最小高度？如果是这样，您可以这样做:

table tr td:first-child::after {
   content: "";
   display: inline-block;
   vertical-align: top;
   min-height: 60px;
}

最初发布于此处的 omelniz 的源代码:Can I use a min-height for table, tr or td?