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 にオーバーライドの問題がありました。質問を投稿した後、これに気づきました。助けてください
前もって感謝します