仅将 CSS 规则应用于 <tr> 中的第一个 <td>，而不分配类/ID

Apply CSS rule to only the first <td> in <tr>'s WITHOUT assigning a class/id?

本文关键字：ID 分配 td 规则 CSS 应用于 tr 仅将 第一个      更新时间：2023-09-26

我已经看过这个了，这不是我在这里需要的。

我需要类似的东西

table.mytable tr first-td's { border: 1px solid black; }

为

<table class="mytable">
<tr>
<td>This has the border</td>
<td>no border</td>
<td>no border</td>
</tr>
<tr>
<td>This has the border</td>
<td>no border</td>
<td>no border</td>
</tr>
<tr>
<td>This has the border</td>
<td>no border</td>
<td>no border</td>
</tr>
</table>

如果这是不可能的，请告诉我，我会很难过。

如果需要完成工作，Javascript/jQuery 是可以接受的。

table.mytable tr td:first-child { border: 1px solid black; }

https://developer.mozilla.org/en-US/docs/CSS/:first-child

也适用于jQuery（http://api.jquery.com/first-child-selector/）：

$('table.mytable tr td:first-child')

是的。有可能：

在 CSS 中使用

.mytable tr td:first-child  { border: 1px solid black; }​

在这里试试

不是 100% 跨浏览器，但支持已经足够好了。见 http://caniuse.com/#search=:first-child

table.mytable tr td:first-child
您可以使用

:first-of-type，但它在较旧的浏览器上不可用：http://jsfiddle.net/R9qE3/。

您也可以通过jQuery（用于跨浏览器支持）选择正确的元素，但是当您添加td或移动它们时，您需要更新状态。

table.mytable tr:first-child {
    border: 1px solid black;
}
你可以

使用 jQuery "nth child" http://api.jquery.com/nth-child-selector/

它将是这样的：

$("table.mytable tr::nth-child(1)")  //do w/e you need to do here.
相关文章：