CSS3のnth-childが上手くいかない

質問

テーブル内のテキスト配置をtext-align: center;にします。
左側の2番目以降をtext-align: left;にしたいです。
どうやったら良いでしょうか？
宜しくお願いします。

回答No.2

AsarKingChang

>一番上の「1ヒート」も左になってしまいますが…
だから、最初のタグは、TDではなくTHなんです。
先頭とそれ以降を区別するためなので。

THのデフォルトはセンターなので、resetCSSをしてCSSが
リセットされている場合は、THタグにも、
センター属性をつけてあげればOKですよ。
先ほどのソースをそのまま、Chromeで表示すると、
「１ヒート」の部分もセンターになるので、
その時に適応されているデフォルトのCSSを
今の環境で設定すれば、それで完了です。
ただ。。
それだと、全部のTABLEが同じ結果になってしまうので、
気になるようでしたら、
table#name でID分けしたほうが、安全かもしれません。
ー＞もちろん、使う時もtable id=nameで選択もしつつ。

お礼

そうですね。クラス名で調整すれば良いですね。

回答No.1

AsarKingChang

<style>
table tr td {
/* これは深い意味はなく、centerになったことをわかるよう余白を作ってるだけ */
width:320px;
}
table tr td:last-child {
text-align:center;
}
</style>

<table border=1>
<tr>
<th>あいうえお</th><th>123</th>
</tr>
<tr>
<td>あいうえお</td><td>123</td>
</tr>
<tr>
<td>あいうえお</td><td>123</td>
</tr>
<tr>
<td>あいうえお</td><td>123</td>
</tr>
</table>
これでいいのかな？
各TABLE内のTR内に配置された「最後のTD」要素にセンターを
指定しただけです。
＃ただし、デフォルトのCSSを一部使用していますので、
THなどに属性がついていない場合は、個別で設定すればOKです。

お礼

コメントありがとうございます。
一番上の「1ヒート」も左になってしまいますが…