使用css替换具有不一致类的表行颜色的方法[重复]

Posted 2023-03-06

【中文标题】使用css替换具有不一致类的表行颜色的方法[重复]

【英文标题】：Way to alternate table row colours with inconsistent classes with css [duplicate]

【发布时间】：2013-09-12 10:44:08

【问题描述】：

我想知道 css 是否足够复杂，可以将表行颜色与包含其他类的表结构中的类进行交替。举个例子：

<table>
<tr class="alt">
<td></td>
</tr>
<tr class="alt">
<td></td>
</tr>
<tr class="differentClass">
<td></td>
</tr>
<tr class="alt">
<td></td>
</tr>
<tr class="differentClass">
<td></td>
</tr>
</table>

所以我想做的只是用“alt”类替换行。

我试过了

table tr.alt:nth-child(even)

查看这个小提琴，你会明白我的意思：http://jsfiddle.net/6mTSP/。 “And again”行应该是白色而不是灰色。

也许仅使用 CSS 解决方案是不可能的？

【问题讨论】：

您正在寻找像 :nth-of-class() 这样不存在的东西。更有可能有更好的方式来构建您的标记。

当然有更好的方法，但可惜这是我必须使用的：/

【参考方案1】：

目前不可能使用纯 CSS 解决方案。除非 CSS 允许组合伪选择器或创建另一个伪选择器（如 cmets 中所述），否则这将需要 javascript。