html - 如何在 html 表中分隔两个 tr

Question

是否有可能在 HTML 表格中的两行 ( tr ) 之间使用视觉分隔符。

我试过 <br>但这不是有效代码。

我尝试在 tr 中添加 padding-top休息后，但它不起作用。

目前我使用空行:

<tr><td colspan=\"X\">&nbsp;</td></tr>

但我不认为这是最好的解决方案，尤其是因为我必须确保 colspan如果列数发生变化，则会进行调整。

有什么办法可以解决吗？

Answer 1

编辑以反射(reflect)我重新阅读了问题而不是问题的标题(原始答案仍然低于规则)。

如果你想要一个视觉分隔符(而不是简单的空白)，那么只需使用:

td {
border-bottom: 1px solid #ccc; /* or whatever specific values you prefer */
}

---

据我所知，增加表格行间距的唯一方法是在各个行/单元格上使用 padding:

td {
    padding: 0.5em 1em;
    border: 1px solid #ccc;
}

JS Fiddle demo

虽然有可能使用透明(或 background-color-ed 边框):

table {
    border-collapse: separate;
}

td {
    border-top: 0.5em solid transparent;
    border-bottom: 0.5em solid transparent;
}

td:hover {
    border-color: #ccc;
}

JS Fiddle demo