HTML 表格背景的棘手 CSS

Question

我一直在使用表格的 CSS，试图影响单元格填充背景颜色。我已经非常接近我需要的东西了，但我被困在一个单元格上。

顶行和左列需要是红色的。完毕。右栏需要是蓝色的。完成 - 除了第一行 CSS 中右上角的单元格是红色的。这就是问题所在。

如何才能使顶行最后一列单元格具有蓝色背景而不影响第一行的其余部分？

谢谢！

这是我的CSS：

 /* changes table's first row and column background colors */
.custom-table tr:first-child td{
    background-color: #9e172d !important;
}
.custom-table td:first-child{
    background-color: #9e172d !important;
}

.custom-table td:nth-child(4) {
  background-color: #3870e2 !important;
}

Answer 1

此选择器：

.custom-table tr:first-child td

比这个更具特异性：

.custom-table td:nth-child(4)

一个选项可能是为第三个规则（蓝色）添加另一个更具体的选择器，专门针对该列中顶行元素的情况。 例如：

.custom-table td:nth-child(4),
.custom-table tr:first-child td:nth-child(4) {
  background-color: #3870e2 !important;
}