[CSS]：在选择

Question

两个样式优先我有两个CSS样式一个表：

<style> 
    tr:nth-child(even){color:blue; background-color:gray;} 
    .SelectedRow {background-color:#f8ffbc;} 
</style> 

在TR上点击我添加SelectedRow类点击TR。奇数TR它的工作，并改回地面，但在甚至是那些不工作

$("tbody td[name='select']").click(function() 
{ 
     $("tbody tr").removeClass("SelectedRow"); 
     $(this).closest("tr").addClass("SelectedRow");       
}); 

http://jsfiddle.net/qburkd3e/

是否有任何特定的优先级或其他的事情，我应该知道这样做？

Answer 1

这是因为CSS选择器的优先级。类和伪类值10，元素为1.请参阅http://css-tricks.com/specifics-on-css-specificity/

在您的第一个选择器中，使用元素和伪类。这是11的权重。你的第二个选择器只是一个类，所以它的权重为10.因此，你的第一个选择器胜过第二个。

您可以通过添加元素来增加第二个重量，以赋予其相同的权重。然后，样式表中后面的那个会优先考虑。

tr:nth-child(even){color:blue; background-color:gray;} 
tr.SelectedRow {background-color:#f8ffbc;}