Html CSS背景色未应用于具有类的所有单元格

我有一个表格，它每隔一行应用一个背景色，以便使用

：nth child

伪类轻松查看，但使用另一个类通过对该单元格应用不同的背景色来突出显示某些信息

令人困惑的是，对于偶数行（其中原始样式为

背景色：无；

），会应用高亮显示颜色，但奇数行（其中样式为

背景色：#C4A66F；

）不会应用新的高亮显示样式

图像

如您所见，高亮显示是零星的。当值等于或大于15时，应将其应用于“Inns”列单元格。类（

tqual

）按预期显示在html中

HTML

下面的html位于每行的循环中，因此

tqual

类被正确添加到值>=15的单元格中

<tr class="tdata">
     <td class="col-name"><?php echo $name; ?></td>
     <td class="col-apps"><?php echo $apps; ?></td>
     <td class="<?php if($inns>=15) echo "tqual ";?>col-inns"><?php echo $inns; ?></td>
     [...]
</tr>

---

有什么想法吗？谢谢。

您在

中的TD即使
TR也没有设置任何
背景色
——因为
无
不是该属性的有效值，因此无效声明将被忽略。（如果要覆盖已使用另一规则的元素上的背景色，则必须使用默认值
transparent
获取“无背景色”。）

因此，带有选择器
td.tqual
的规则能够为那些td设置背景色，但不能为
odd
TR中的那些设置背景色，因为
td.tqual
是一个比
TR.tdata:n子（奇）td
特异性更低的选择器

（将第一条规则中的
背景色
更改为有效值，例如
红色
——您将看到，您的TD中的
类tqual
将不再应用黄色背景。）

因此，解决方案很简单：使用至少具有相同特异性的规则为那些
.tqual
单元格提供背景色。（并修复错误的
背景色
值
无
）
请阅读选择器专用性。是的，但问题是它覆盖了一个伪类，而不是另一个。啊，我明白了
tr.tdata td.tqual
修复问题。出于兴趣，我正在为使用
background:none的行替换一个普通的基于类的系统。如果我说我正在有效地将
背景图像
设置为
无
，并且应用了
背景色
的默认值（我假设是
透明的
）。
tr.tdata:nth-child(even) td {
    background-color: none;
}

tr.tdata:nth-child(odd) td {
    background-color: #C4A66F;
}

td.tqual {
    background-color: #DDDD00;
}