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而不是cols，但我的解决方案的总体思路是相同的。

jsFiddle 演示

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

Answer 2

通过格式化表格单元格cols理论上应该可以工作，但浏览器并不总是尊重这一点。td改为格式化，请参阅http://jsfiddle.net/2Gkxc/3/

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