Question

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

在线查看，empty-cells: show;作为常数答案出现，但它似乎没有保持高度。我认为这是一系列内联块div，但边界变得凌乱，边界不会崩溃。

我真的只有一张空桌

<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?

Answer 2

试试这个

对于 <th> 和 <td> ：

th:empty::before,td:empty::before{content:'\00a0';visibility:hidden}

仅适用于<td>：

td:empty::before{content:'\00a0';visibility:hidden}

说明：

'\00a0' 是单个空格的代码

visibility:hidden 隐藏单个空格

显示空表格单元格

2 个答案: