css - 将表的最后一行分开

Question

是否可以将表格的最后一行分开？ 我阅读了边界折叠和边界间距。这些将影响所有表格元素。我试图只分隔表格的最后一行。

出于说明目的:

<table>
    <tbody>
        <tr></tr>
        <tr></tr>
    </tbody>
    <tfoot>
        <tr></tr>
    </tfoot>
</table>

在上面给出的示例中，我还尝试通过将其显示覆盖到表格来分离 tfoot。但是当它对我想要实现的前景造成更大的损害时。我可以使用任何 CSS 技巧吗？

注意*

我尝试了所有可能的技巧，想法是将 tfoot 与 tbody 分开。要求是 tfood 的背景为绿色，tbody 的背景色为蓝色。分开时，它应该在这两个标签之间显示一个白色空白。我像大多数人说的那样实现了填充，但它并没有起到作用。有什么想法吗？

问题已解决

基本上，我所做的是包含一个虚拟行并隐藏其边框。

Answer 1

如果通过分隔您只是想在行之间创建一些空间，一个技巧是在顶部为 footer 中的单元格提供一些透明边框。

tfoot tr:first-child td {
  border-top: 1em solid transparent;
}

<table>
  <tbody>
    <tr>
      <td>data 1</td>
    </tr>
    <tr>
      <td>data 2</td>
    </tr>
  </tbody>
  <tfoot>
    <tr>
      <td>footer</td>
    </tr>
  </tfoot>
</table>