1.colspan && rowspan均在td标签中使用
2.每个单元格大小一致的前提
<table border="1" bordercolor="red">
<tr>
<td>nokiacomputer</td>
<td>nokiacomputer</td>
<td>nokiacomputer</td>
</tr>
<tr>
<td>nokiacomputer</td>
<td>nokiacomputer</td>
<td>nokiacomputer</td>
</tr>
</table>
效果:
colspan属性代码:
<table border="1" bordercolor="red">
<tr>
<td>nokiacomputer</td>
<td>nokiacomputer</td>
<td>nokiacomputer</td>
</tr>
<tr>
<td colspan="3">nokiacomputer</td>
</tr>
</table>
效果:
全面举例说明:
一行一列的表格:
<table>
<tr>
<td></td>
</tr>
</table>
一行两列的表格:
<table>
<tr>
<td></td>
<td></td>
</tr>
</table>
一行三列的表格:
<table>
<tr>
<td></td>
<td></td>
<td></td>
</tr>
</table>
两行一列的表格:
<table>
<tr>
<td></td>
</tr>
<tr>
<td></td>
</tr>
</table>
两行两列的表格:
<table>
<tr>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
</tr>
</table>
有趣的现象:
<table border="1" bordercolor="red">
<tr>
<td rowspan="2">nokiacomputer</td>
<td>nokiacomputer</td>
<td>nokiacomputer</td>
</tr>
<tr>
<td>nokiacomputer</td>
<td>nokiacomputer</td>
<td>nokiacomputer</td>
</tr>
<tr>
<td>nokiacomputer</td>
<td>nokiacomputer</td>
<td>nokiacomputer</td>
</tr>
</table>
效果:
而在第二行去掉一个<td>nokiacomputer</td>时 ,
代码如下:
<table border="1" bordercolor="red">
<tr>
<td rowspan="2">nokiacomputer</td>
<td>nokiacomputer</td>
<td>nokiacomputer</td>
</tr>
<tr>
<td>nokiacomputer</td>
<td>nokiacomputer</td>
</tr>
<tr>
<td>nokiacomputer</td>
<td>nokiacomputer</td>
<td>nokiacomputer</td>
</tr>
</table>
效果:
为什么多一列时会自动向后排?
多两列时会不会也是这样的?
效果:
果然如此!