CSS テーブルタグの二列目にそれぞれ色を付けたい

質問

http://takuya-1st.hatenablog.jp/entry/2013/12/05/035607
これを参考にやってみましたが、何も反映されませんでした。
ややこしくてうまくいけませんでした。

テーブルタグ
<table>
<tr>
<td>A</td>
<td>赤</td>
</tr>
<tr>
<td>B</td>
<td>白</td>
</tr>
<tr>
<td>C</td>
<td>黄</td>
</tr>
</table>

どうすれば良いか、教えてください。
よろしくお願いします。

回答No.1

AsarKingChang · ベストアンサー

<style>
/* 2段目の左側(正確には偶数ライン) */
tr:nth-child(even) td:nth-child(1) {
color:red;
}
/* 2段目の右側(正確には偶数ライン) */
tr:nth-child(even) td:nth-child(2) {
color:green;
}
</style>

<table>
<tr>
<td>A</td>
<td>赤</td>
</tr>
<tr>
<td>B</td>
<td>白</td>
</tr>
<tr>
<td>C</td>
<td>黄</td>
</tr>
</table>
普通に動きますよ。
この手の質問の場合は、書いてみたCSSも貼ってみると
原因がわかりやすくて楽ですよ。
今回「偶数ライン」で有効なCSSを書いておきましたが、
２ライン目限定なら、evenを2にすれば、２ライン目「のみ」になります。
それでは

お礼

ありがとうございます。
おかげさまでうまくいけました。