如何使用CSS选择表格中除特定行以外的所有行？

I would like to apply a style to every row in a table except a specific row (could be the first, or could be one with a unique class or ID - doesn't matter).

我想将一个样式应用于表中的每一行,除了特定行(可能是第一行,或者可能是具有唯一类或ID的行 - 无关紧要)。

How do I do that?

我怎么做?

3 个解决方案

#1

The easiest cross-browser way is to apply the style then override it, like this:

最简单的跨浏览器方式是应用样式然后覆盖它,如下所示:

table tr td { background: blue; }
table tr.someClass td { background: none; }

Since the one with the class, ID, etc is more specific, it'll have the different styling...just put whatever properties you're setting for all rows in that selector so it overrides/reverses the styling. The benefit of this approach is it doesn't need any partially supported (CSS3) selectors, it already works in all browsers.

由于具有类,ID等的那个更具体,它将具有不同的样式...只需为该选择器中的所有行设置任何属性,以便它覆盖/反转样式。这种方法的好处是它不需要任何部分支持的(CSS3)选择器,它已经适用于所有浏览器。

#2

You could use the CSS3 :not() selector. It does exactly what you'd expect it to do.

您可以使用CSS3:not()选择器。它完全符合您的期望。

table tr:not(.special) { color: green }

See this article for more information: The CSS3 :Not() Selector

有关更多信息,请参阅此文章:CSS3:Not()选择器

#3

The obvious way would be:

显而易见的方法是:

tr { style for most rows; }
tr.specificrow { style for the specific row; }

and then

<table>
...
<tr>...</tr>
<tr class="specificrow">...</tr>
...
</table>

#1