html - HTML テーブルを設定し、列幅を偶数行の 2X に設定します

Question

奇数列の幅を 1X に設定し、偶数行を 2X の奇数行に設定するための相対的な解決策が必要です。私はこのCSSを使用しています：

.colTest{
    width:100%;
}
.colTest col:nth-child(2n+1){
    width: 100px;
}
.colTest col:nth-child(2n){
    width: 200px;
}

のように: jsFiddle

列の数が異なるテーブルの列に相対値 (%) を設定するにはどうすればよいですか? (テーブルの列が 2 から 10 の間で可変であることを意味します)

Answer 1

jsFiddle デモ

.colTest {width:100%}
.colTest col:nth-child(2n+1){
    width: 1%;
}
.colTest col:nth-child(2n){
    width: 2%;
}

アップデート：

cbroeが言っtdたように、sの代わりに良い結果が得られますcolが、私の解決策の一般的な考え方は同じです.

jsFiddle デモ

.colTest {width:100%}
.colTest td:nth-child(2n+1){
    width: 1%;
}
.colTest td:nth-child(2n){
    width: 2%;
}

Answer 2

Formatting table cells via cols should work in theory, but browsers don’t always respect that. Format the td instead, see http://jsfiddle.net/2Gkxc/3/

td:nth-child(2n+1){
    width: 100px;
}
td:nth-child(2n){
    width: 200px;
}