TABLEの中間列だけを個別指定

css3のtd:nth-childの扱いでお助けください。
奇数列、偶数列をそれぞれ設定しているのですが、
中間1列(↓列3)を個別設定、次の列から奇数列として扱いたいです。
どのようにすれば良いでしょうか？

1	2	3	4	5

ここに言語を入力ここに言語を入力
td:nth-child(odd) {
width:17px;
}
td:nth-child(even) {
width:100px;
}
td:nth-child(3) {
width:30px;
}




補足：１,３,４を奇数、２,５を偶数として扱いたいです。

質問への追記・修正の依頼
kei344  2017/03/09 19:05
2のみ偶数、1,4,5を奇数列として扱うということですか？ 

karashi  2017/03/13 09:59
返信が遅くなりすみません。２,5を偶数、1,3,4を奇数にしたいです。 

kei344  2017/03/13 11:14
列数は5以上になる可能性はありますか？その場合どのようになりますか？ 

karashi  2017/03/13 11:43
列数は最大13列です。その場合は1,3,5,7,8,10,12を奇数、2,4,6,9,11,13を偶数にしたいです。 

kei344  2017/03/13 11:45
中央から前と後で変えるという事ですね、偶数列の場合は？ 

karashi  2017/03/13 11:53
その通りです。ですので、今のところ偶数列での作成は想定していないです。 

kei344  2017/03/13 11:58
HTMLの変更（classの付与）については可能でしょうか。 

karashi  2017/03/13 12:01
もちろんです。 

kei344  2017/03/13 12:06
わかりました、回答ありがとうございます。
ちなみに、ここでのやり取りはteratailの構造上「クリックしないと見られない」ので、質問文に追記しておいてください。
よろしくお願いします。

kei344

2017/03/09 10:05

2のみ偶数、1,4,5を奇数列として扱うということですか？

karashi

2017/03/13 00:59

返信が遅くなりすみません。２,5を偶数、1,3,4を奇数にしたいです。

kei344

2017/03/13 02:14

列数は5以上になる可能性はありますか？その場合どのようになりますか？

karashi

2017/03/13 02:43

列数は最大13列です。その場合は1,3,5,7,8,10,12を奇数、2,4,6,9,11,13を偶数にしたいです。

kei344

2017/03/13 02:45

中央から前と後で変えるという事ですね、偶数列の場合は？

karashi

2017/03/13 02:53

その通りです。ですので、今のところ偶数列での作成は想定していないです。

kei344

2017/03/13 02:58

HTMLの変更（classの付与）については可能でしょうか。

karashi

2017/03/13 03:01

もちろんです。

kei344

2017/03/13 03:06

わかりました、回答ありがとうございます。ちなみに、ここでのやり取りはteratailの構造上「クリックしないと見られない」ので、質問文に追記しておいてください。よろしくお願いします。

行動規範の内容に同意します

回答3件

ベストアンサー

とりあえずわかりやすく色分けで。

CSS
1th {
2	text-align: center;
3	width: 1em;
4}
5table th.center {
6	background-color: #5aa;
7}
8th:nth-child(odd),
9th.center ~ th:nth-child(even) {
10	background-color: #aa5;
11}
12th:nth-child(even),
13th.center ~ th:nth-child(odd) {
14	background-color: #a5a;
15}
16```**動くサンプル：**[https://jsfiddle.net/azzyxukq/](https://jsfiddle.net/azzyxukq/)
17
18---
19
20【意外と知らない!?CSSセレクタ20個のおさらい｜Webpark】
21[http://weboook.blog22.fc2.com/blog-entry-268.html](http://weboook.blog22.fc2.com/blog-entry-268.html)
22
23【【CSS】CSSのセレクタとは？ 覚えておきたいセレクタ21選】
24[http://scene-live.com/page.php?page=42](http://scene-live.com/page.php?page=42)