TR中的最后一个TD和倒数第二个TD（CSS/LESS）

Question

经过google-ing和stackoverflow-ing，还是没能解决这个问题：

我有一张大约有十几行的桌子。其中一行如下所示：

<tr class="rvw-product-total">
    <td colspan="2"></td>
    <td>Total:</td>
    <td>$180.67</td>
</tr>

此行中的最后两个 TD（总计和 $180.67）应具有绿色background-color和bold文本。

所以我可以像这样在 CSS/LESS 中完成这个：

tr[class="rvw-product-total"]:last-child td, tr[class="rvw-product-total"]:nth-child(n+2) td {
    font-weight: bold;
    background-color: #DFF0D8;
}

这使得background-color整行的 为绿色。

然后我尝试background-color将第一个 TD显式设置为白色，如下所示：

tr[class="rvw-product-total"]:first-child td {
    background-color: #fff;
}

但是整行仍然是绿色的background-color，我只是好奇我在这里做错了什么？

这是 jsfiddle 的快速演示：http : //jsfiddle.net/acegyver/EYVvc/2/

Answer 1

第一个选择器应该是：

table.prod-rvw-tbl tr[class="rvw-product-total"] td:last-child,

第二个选择器应该是：

table.prod-rvw-tbl tr[class="rvw-product-total"] td:nth-child(n + 2)

小提琴