html - 在唯一的表格行上取最后一个孩子而不是第一个孩子

Question

我有以下 CSS：

table tbody tr:last-child td {
  padding-top: 7px;
  border-bottom: 0;
}

table tbody tr:first-child td {
  padding-top: 6px;
}

现在我可能有一张只有一行的桌子。
唯一的表格行现在分配给first-child而不是last-child，但我希望它是相反的。

有没有没有Javascript的方法？

score 1 · Accepted Answer

您可以制定一个规则，仅当 tr 同时是第一个孩子和最后一个孩子时，这table tbody tr:first-child:last-child td将添加到与table tbody tr:last-child td. 它会是这样的：

table tbody tr:last-child td,
table tbody tr:first-child:last-child td{
  padding-top: 7px;
  border-bottom: 0;
}

score 1 · Accepted Answer

这不可能。您的标记中一定有一些错误。如果它真的是唯一的tr，两者lastANDfirst都会匹配。

但是，将应用哪个 CSS 取决于您的 css-rules 的顺序。padding-top: 7px; or padding-top: 6px;因此，您可以通过相应地放置规则来确定是否应适用。

编辑：

由于您的问题是由插件引起的，该插件在末尾自动插入一行，您可以简单地使用:nth-last-child(2)来匹配倒数第二个元素。
_{（但请注意，浏览器对的支持nth-last-child略差于last-child）}

2 回答 2