我有两种风格，每一种都是在独立的第三方控制下宣布的，不能很好地配合，我甚至不知道为什么-最终-如何让它们按我的意愿工作。
HTML格式：
<table>
<tr class="myrow">
<td>normal cell</td>
<td class="ui-state-error">error cell</td>
</tr>
</table>
CSS:
.myrow>td { /* declared in the grid component */
background-color: #88f;
}
.ui-state-error { /* declared in jQuery UI */
background-color: #f00;
}
html和css都被简化以显示确切的错误。Here's the fiddle。
这里的最终结果是两个单元格都显示蓝色背景（FF 46.0）。
不过，我希望
.ui-state-error会更具体，因为它直接应用于有问题的单元格，而.myrow>td规则乍一看似乎更通用。无论如何，浏览器决定应用
.myrow>tdcss，我想让它应用.ui-state-error。考虑到css样式本身不在我的控制之下，我该怎么做呢？
最佳答案
这两个规则都直接应用于单元格-一个是通过class应用的，另一个是通过元素类型应用的。由于具有元素类型的选择器附加了另一个选择器，因此它具有更高的特殊性，因此获胜。
选择器的特殊性是010，因为它只有一个类选择器作为复杂选择器的一部分，而选择器的特殊性是011，因为它有一个类和一个元素类型选择器作为复杂选择器的一部分。
您可以更改如下所示的选择器，使错误class具有红色背景。
.myrow > .ui-state-error {
background-color: #f00;
}
像上面这样更改选择器不会覆盖所有其他样式。它将只重写特异性低于010的选择器，并且只应用于其祖先具有
.ui-state-error时具有myrow > td的元素。如果
td是一个特定于主题的类，并且您希望class='ui-state-error元素的颜色为红色，而不考虑主题，那么您可以更改选择器，如下所示：tr > .ui-state-error {
background-color: #f00;
}
这也具有011的特异性，并且会覆盖
class='myrow'。在https://specificity.keegan.st/上有一个专用计算器，在您完全熟悉专用性计算之前，您会发现它非常方便和有用。
简单地说，具体计算方法如下：
计算作为完整选择器一部分的ID选择器的总数。把这个当作
myrow计算作为完整选择器一部分的类、属性和伪类选择器的总数。把这个当作
.ui-state-error。计算作为完整选择器一部分的元素类型选择器和伪元素选择器的总数。把这个当作
.myrow > td。最终的特异性是
a+b+c（串联而不是总和）。