我想选择 tbody 的第一个 tr 内的所有 td。我通常会这样做:tbody:first-child td --> 但这给了我你可以在图像上看到的结果,黄色是结果。
我的 html - 简短版
我知道有未关闭的标签,但我从我的调试器中复制了它,因为所有内容都是由 jquery 生成的。有什么想法吗?
<table class="wc-header">
<thead>
<tbody>
<tr>
<td rowspan="3">Medewerker 1</td>
<td class="row_header">Van</td>
<td class="hours" data-person="1" data-day="1" data-row="from">
<input class="past selected" type="text" readonly="readonly">
</td>
<td class="hours" data-person="1" data-day="2" data-row="from">
<td class="hours" data-person="1" data-day="3" data-row="from">
<td class="hours" data-person="1" data-day="4" data-row="from">
<td class="hours" data-person="1" data-day="5" data-row="from">
<td class="hours specialday" data-person="1" data-day="6" data-row="from">
<td class="hours specialday" data-person="1" data-day="7" data-row="from">
<td class="hours" data-person="1" data-day="8" data-row="from">
<td class="hours wc-today" data-person="1" data-day="9" data-row="from">
<td class="hours" data-person="1" data-day="10" data-row="from">
<td class="hours" data-person="1" data-day="11" data-row="from">
<td class="hours" data-person="1" data-day="12" data-row="from">
<td class="hours specialday" data-person="1" data-day="13" data-row="from">
<td class="hours specialday" data-person="1" data-day="14" data-row="from">
<td class="hours" data-person="1" data-day="15" data-row="from">
<td class="hours" data-person="1" data-day="16" data-row="from">
<td class="hours" data-person="1" data-day="17" data-row="from">
<td class="hours" data-person="1" data-day="18" data-row="from">
<td class="hours" data-person="1" data-day="19" data-row="from">
<td class="hours specialday" data-person="1" data-day="20" data-row="from">
<td class="hours specialday" data-person="1" data-day="21" data-row="from">
</tr>
<tr>
<td class="row_header">Tot</td>
<td class="hours" data-person="1" data-day="1" data-row="till">
<td class="hours" data-person="1" data-day="2" data-row="till">
<td class="hours" data-person="1" data-day="3" data-row="till">
<td class="hours" data-person="1" data-day="4" data-row="till">
<td class="hours" data-person="1" data-day="5" data-row="till">
<td class="hours specialday" data-person="1" data-day="6" data-row="till">
<td class="hours specialday" data-person="1" data-day="7" data-row="till">
<td class="hours" data-person="1" data-day="8" data-row="till">
<td class="hours wc-today" data-person="1" data-day="9" data-row="till">
<td class="hours" data-person="1" data-day="10" data-row="till">
<td class="hours" data-person="1" data-day="11" data-row="till">
<td class="hours" data-person="1" data-day="12" data-row="till">
<td class="hours specialday" data-person="1" data-day="13" data-row="till">
<td class="hours specialday" data-person="1" data-day="14" data-row="till">
<td class="hours" data-person="1" data-day="15" data-row="till">
<td class="hours" data-person="1" data-day="16" data-row="till">
<td class="hours" data-person="1" data-day="17" data-row="till">
<td class="hours" data-person="1" data-day="18" data-row="till">
<td class="hours" data-person="1" data-day="19" data-row="till">
<td class="hours specialday" data-person="1" data-day="20" data-row="till">
<td class="hours specialday" data-person="1" data-day="21" data-row="till">
</tr>
<tr>
</tbody>
<tbody>
<tbody>
<tbody>
</table>
编辑
也许我应该解释一下我实际上想做什么。您在左侧看到的黑线是给 TBODY 的边框。我希望这条线具有表格的宽度,但边框会被 td 的边框覆盖。也许还有其他解决方案?
CSS
[data-person] {
border:1px solid #DEDEDE;
}
tbody tr:first-child td {
background-color:yellow;
}
已解决
我遇到了 td 的覆盖问题。在我发布问题后意识到这一点,感谢帮助
提前致谢
最佳答案
关于html - 使用CSS选择器在嵌套表中选择tr中的所有td,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16537963/