Css - 最后一行无论TD还是TH

Question

如何使用CSS选择器始终捕获表的最后一行并将规则应用于最后一个除法，无论它是TD还是TH，而不是更改表中的最后一个TH。 / p>

我目前的规则仅适用于如果它是TD，以及我发现进行TH轮次的所有方式，即使其中有更多的TD，它也会回合。

.tabGeral tr:first-child th:first-child  {
    border-top-left-radius:14px;
}
.tabGeral tr:first-child th:last-child  {
    border-top-right-radius:14px;
}
.tabGeral tr:last-child td:last-child {
    border-bottom-right-radius:14px;
}
.tabGeral tr:last-child td:first-child{
    border-bottom-left-radius:14px;
}

前两个是期望的结果，底部的两个是我实现的

JSFiddle：https://jsfiddle.net/rd48cfw8/3/

两个深绿色是TH，浅绿色是TD，由于桌子分拣机，我需要它们是TH和TD。

如果我只使用tr:last-child td:first-child，则第二个表格未实现，如果我仅使用tr:last-child th:first-child，则第一个表格未实现，如果我同时使用两个表格，我得到了第四张桌子，不太理想。

Answer 1

获取您将使用的第二个最后一个表行

tr:nth-last-child(2) {}

然后，您可以使用

设置td的样式

首先从后面选择

tr:nth-last-child(1) {}

将是最后一个孩子，等等。

您可以在第二个td中设置tr样式

tr:nth-last-child(2) td {
   (whatever styling you want.)
}

更新：

这是我用它修复它的小提琴：

.tabGeral:last-child tr:last-child th {
    -webkit-border-bottom-right-radius: 9px;
    -webkit-border-bottom-left-radius: 9px;
    -moz-border-radius-bottomright: 9px;
    -moz-border-radius-bottomleft: 9px;
    border-bottom-right-radius: 9px;
    border-bottom-left-radius: 9px;
}

JSFIDDLE

Answer 2

为什么不使用隐藏在桌面上的溢出来切断边界半径