如何覆盖CSS类中的优先级？

Home
Option 1
Option 2

And I apply the styles with this classes

我将这些类应用于这些类

#contentheader .cat {
border-top:3px solid #ccc;
background-color:#eee;
overflow:hidden;
}

#contentheader .cat li a {
color:#999;
font-weight:700;
text-decoration:none;
font-size:13px;
display:block;
border-right:1px solid #fff;
float:left;
padding:10px;
}

#contentheader .cat li a:hover {
background-color:#E9E9E9;
}

The problem is that I need the first <li> (Home) to be different, maybe making the text in other color, or maybe making the font wider. I try assigning a class directly to the <li> or the <a> tags, but it doesn't works, it always take the styles in the #contentheader .cat li a class. What is the best way to do this? Thanks

问题是我需要第一个

(Home)不同,可能是用其他颜色制作文本,或者可能使字体更宽。我尝试直接将类分配给

或标签,但它不起作用,它总是将#contentheader .cat li中的样式作为一个类。做这个的最好方式是什么?谢谢

2 个解决方案

#1

You need to increase the specificity of that selector to have it override a rule with a lower selector specificity.

您需要增加该选择器的特异性,以使其覆盖具有较低选择器特异性的规则。

So if you assign the class to the li element, use #contentheader .cat li.class a, for the a element, use #contentheader .cat li a.class.

因此,如果将类分配给li元素,请使用#contentheader .cat li.class a,对于a元素,请使用#contentheader .cat li a.class。

2 个解决方案

#1

更多相关文章

随机推荐