css - この td 要素を選択するには?

Question

値が 2 の td 要素を選択する必要があります。プレーンCSSでどうすればそれを行うことができますか?

<tr class="Foobar">
   <td>1</td>
   <td>2</td>
   <td>3</td>
</tr>

ありがとう！

Answer 1

それがあなたが選択したい2番目の要素であると仮定して（数字を含む要素ではなく）、私はお勧めtdします： td2

tr.Foobar td:nth-of-type(2) {
    /* your CSS */
}

JS フィドルのデモ。

tr.Foobar td:nth-child(2) {
    /* your CSS */
}

JS フィドルのデモ。

:nth-of-type()またはをサポートせずに古いブラウザをサポートする必要がある場合は:nth-child()、次を使用できます。

tr.Foobar td:first-child + td {
    /* your CSS */
}

JS フィドルのデモ。

参考文献:

• CSS セレクター。