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/

如何改变特定表行id的阴影

1 个答案: