嵌套合并单元格

Question

我试图做一个简单的表，但有一次我在连续的表格行设置colspans，第二行的colspan属性都将被覆盖：

<table class="d-week"> 
<caption> 
<h4>table</h4> 
</caption> 
<thead> 
    <tr> 
     <th class="col_first"></th> 
     <th colspan="1">1st week</th> 
     <th colspan="1">2nd week</th> 
     <th colspan="1">3rd week</th> 
    </tr> 
    <tr> 
     <th></th> 
     <th colspan="3">prop1</th> 
     <th colspan="3">prop2</th> 
     <th colspan="3">prop3</th> 
    </tr> 
</thead> 
<tbody> 
    <tr> 
     <td></td> 
     <td>col1</td> 
     <td>col1</td> 
     <td>col1</td> 
     <td>col2</td> 
     <td>col2</td> 
     <td>col2</td> 
     <td>col3</td> 
     <td>col3</td> 
     <td>col3</td> 
    </tr> 
</tbody> 
</table> 

但在这里，表体细胞与第一行的标题对齐，而不是第二行（即使我从第一个标题的行中删除colspan属性）。有人能帮助我吗？

编辑：如果在第二个标题的行中有多于3个th会怎么样？ http://jsbin.com/icetom/3

Answer 1

我don'tknow如果我理解不错，但是，也许你只需要设置列跨度= 3头的第一行。您可以考虑相对于您将拥有的最大单元数的calspan。在你的例子中，它是10.如果你想要一行中的一个列跨越多个列，你可以根据它选择数字。

Answer 2

<table> 
<caption> 
<h4>table</h4> 
</caption> 
<thead> 
    <tr> 
     <th></th> 
     <th colspan="3">1st week</th> 
     <th colspan="3">2nd week</th> 
     <th colspan="3">3rd week</th> 
    </tr> 
    <tr> 
     <th></th> 
     <th colspan="3">prop1</th> 
     <th colspan="3">prop2</th> 
     <th colspan="3">prop3</th> 
    </tr> 
</thead> 
<tbody> 
    <tr> 
     <td></td> 
     <td>col1</td> 
     <td>col1</td> 
     <td>col1</td> 
     <td>col2</td> 
     <td>col2</td> 
     <td>col2</td> 
     <td>col3</td> 
     <td>col3</td> 
     <td>col3</td> 
    </tr> 
</tbody> 
</table> 

活生生的例子在这里：http://jsbin.com/ateraw/