css - テーブルでn番目の子を使用するtrtd

Question

<table>
  <tr>
    <th>&nbsp;</th>
    <td>$</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <th>&nbsp;</th>
    <td>$</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <th>&nbsp;</th>
    <td>$</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <th>&nbsp;</th>
    <td>$</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <th>&nbsp;</th>
    <td>$</td>
    <td>&nbsp;</td>
  </tr>
</table>

これが私のコードです。すべてのsの<td>背景に「$」が付いたsが必要です。#CCC<tr>

nth-child疑似クラスを使用してこれを行う方法を教えてもらえますか？

Answer 1

table tr td:nth-child(2) {
    background: #ccc;
}

作業例: http://jsfiddle.net/gqr3J/

Answer 2

現在の css バージョンは、コンテンツによるセレクターの検索をまだサポートしていません。しかし、cssセレクターを属性で検索する方法がありますが、内部にあるすべての<td>ものに識別子を付ける必要があります。$例: テーブルで nth-child を使用する tr td

html

<tr>
    <td>&nbsp;</td>
    <td data-rel='$'>$</td>
    <td>&nbsp;</td>
</tr>

CSS

table tr td[data-rel='$'] {
    background-color: #333;
    color: white;
}

これらの例を試してみてください。

table tr td[data-content='$'] {
    background-color: #333;
    color: white;
}

<table border="1">
    <tr>
        <td>A</td>
        <td data-content='$'>$</td>
        <td>B</td>
        <td data-content='$'>$</td>
        <td>C</td>
        <td data-content='$'>$</td>
        <td>D</td>
    </tr>
</table>