CSS背景颜色挑剔

CSS背景颜色给我带来了问题。样式块需要使用“.land.custom_one”而不是普通的“.custom_one”来工作。从td级去除“土地”也使它工作，但我需要“土地”类悬停工作，因为它不是所有需要悬停效果的tds。样式块正在定义在style.css之后。 Chrome和Firefox都有这个问题。CSS背景颜色挑剔

style.css 
#id table { 
    background-color: blue; 
} 
#id td.land { 
    background-color: green; 
} 
#id td.land:hover { 
    background-color: black; 
    color: orange; 
} 

style block 
.custom_one { 
    background-color: red; 
    color: white; 
} 

html 
<td class="land custom_one"></td>

来源

2010-06-22 Kim

一个选择的特异性的计算方法如下：

计数在选择器ID的属性数（= A）
计数在选择其它属性和伪类的数量（= b）
计算选择器中元素名称的数量（= c）
忽略伪元素。

连接三个数字a-b-c（在一个大基数系统中）给出了特异性。

元素选择：0，0，1（1）

类选择0，1，0（10）

ID选择器1，0，0（100）

CSS：

.blue { 
font-color:blue; 
} 

#red { 
font-color:red; 
}

HTML：

<div class="blue"> 
    <div class="blue"> 
     <div class="blue"> 
      <div id="red">this text will be red</div> 
     </div> 
    </div> 
    </div>

来解释它的最好方法是什么这个家伙做：CSS: Specificity Wars

来源

2010-06-22 01:52:43 Sphvn

解决方案是将块样式定义为“.custom_one，#id td.land.custom_one”。 – Kim 2010-06-22 08:22:54

当一切都失败了，使用!important。

.custom_one { 
    background-color: red !important; 
    color: white !important; 
}

来源

2010-06-22 02:19:13 recursive

但值得注意的是，如果您了解特异性，则不应该需要它。 – Sphvn 2012-03-08 05:14:24

CSS背景颜色挑剔

回答

相关问题