Question

我想知道是否有一种方式（表格，背景，文字，悬停效果）整个表格的第一行？我尝试了很多，但没有任何作用。我也试过这个：

.category_table td{
background: #000;
color: #fff;
font-weight: bold;}

但没有任何作用。有人可以帮我解决这个问题吗？

Answer 1

你自己说，第一个ROW，所以这就是你需要的目标。

.category_table tbody tr:first-child td { /* styles for first row's cells */ }

（我假设你的桌子有tbody;如果没有，请删除选择器的这一部分。）

Answer 2

您可能必须这样做：

HTML：

<table><tr class="row1">

<td>Something</td>

<td>Somthing</td>

</tr><tr>

<td>Something</td>

<td>Somthing</td>

</tr></table>

CSS：

.row { /*Style the  1st row*/

}
.row td { /*style each <td> in the 1st row*/

}

Answer 3

如果您希望获得最佳浏览器兼容性，请在该行中添加一个类。如果您只关心较新的浏览器，那么您可以使用tr：first-child selector

在上面的链接中，您会注意到现代浏览器中都应用了两种样式。如果您在旧浏览器中查看（例如IE6），那么只有着色样式才会生效，而字体大小的选择器不会作为不受支持的选择器。如果您只想定位新浏览器，那么第一个孩子不需要对您的HTML进行任何更改，这可能是也可能不是问题

Answer 4

在一般情况下，您需要选择表格的第一个thead或tbody子项的第一个孩子：

thead:first-of-type > :first-child,
tbody:first-of-type > :first-child {
  font-weight: bold; /* or whatever you want to set */
}

更简单的选择器tr:first-child适用于table元素仅包含一个tbody元素作为子元素的简单情况（当您只编写tr元素时就是这种情况在它里面 - 然后暗示一个tbody。但通常，表格可能包含thead元素，tfoot元素和多个tbody元素。

注意：如果没有thead元素且tfoot元素之前的标记中有tbody个元素，那么第一个tr是否存在争议在tfoot元素中是第一行。在标记中，它是最后渲染的（在默认渲染中）。我已经解释了在这个问题上要忽略tfoot元素。

对这里使用的CSS选择器的支持是好的，但不是通用的。要在所有支持CSS的浏览器中获得支持，请在第一个class元素中添加tr属性，例如<tr class=first>，并使用类选择器，例如.first。