如何更改特定表格行的陰影ID

Question

我正在使用Ruby on Rails生成表格。用css很容易以不同的顏色對奇數/偶數行進行着色。給定顏色的特定ID /類的行也很容易。我需要根據ID爲表格添加行。我的問題是，我該如何替換該id的顏色，IE：爲給定的id替換相同顏色的不同陰影？

#owner tr:nth-of-type(odd){ background:#eee !important;} 

這種性質的CSS不起作用。我唯一的解決方案JS/JQ？非常喜歡純粹的CSS解決方案。

Answer 1

如果我明白你的問題，你可以使用rgba來遮蔽顏色。

• background-color：rgba（0，0，0，1.5）; // darker
• background-color：rgba（0，0，0，1.0）; //正常
• background-color：rgba（0，0，0，0.5）; //打火機

CSS

.table-class { 
width: 500px; 
font-size: 15px; 
} 

.table-class td { 
width: 25%; 
} 

#owner tr:nth-child(odd) { 
background-color: rgba(0, 0, 0, 1.2); 
color: rgba(255, 255, 255, 0.8); 
} 

#owner tr:nth-child(even) { 
background-color: rgba(0, 0, 0, 0.8); 
color: rgba(255, 255, 255, 1.2); 
} 

HTML

<table class="table-class" id="owner"> 
<tr> 
<td>test test</td> 
<td>test test</td> 
<td>test test</td> 
<td>test test</td> 
</tr> 
<tr> 
<td>test test</td> 
<td>test test</td> 
<td>test test</td> 
<td>test test</td> 
</tr> 
<tr> 
<td>test test</td> 
<td>test test</td> 
<td>test test</td> 
<td>test test</td> 
</tr> 
<tr> 
<td>test test</td> 
<td>test test</td> 
<td>test test</td> 
<td>test test</td> 
</tr> 
</table> 

的jsfiddle你可以玩它，看看是否是你所需要的。

http://jsfiddle.net/t4J9s/