合并前效果:
合并之后:
代码:
<h4>合并单元格</h4>
<h5>合并之前</h5>
<table border="1" cellspacing="0" width="580" height="320">
<caption>
<strong>个人简介</strong>
</caption>
<tr align="center">
<td>
<strong>姓名:</strong>刘德华
</td>
<td>
<strong>性别:</strong>男
</td>
<td>
<strong>年龄:</strong>61
</td>
<!-- 目标单元格 先上后下 -->
<td width="120">
照片
</td>
</tr>
<tr align="center">
<td>
<strong>身高:</strong>175
</td>
<td>
<strong>民族:</strong>汉
</td>
<td>
<strong>婚姻:</strong>未婚
</td>
<td width="120">
照片
</td>
</tr>
<tr align="center">
<td>
<strong>个人简介</strong>
</td>
<!-- 目标单元格 先左后右 -->
<td>
个人简介内容
</td>
<td>
个人简介内容
</td>
<td>
个人简介内容
</td>
</tr>
<tr align="center">
<td>
<strong>个人作品</strong>
</td>
<!-- 目标单元格 先左后右 -->
<td>
个人作品内容
</td>
<td>
个人作品内容
</td>
<td>
个人作品内容
</td>
</tr>
</table>
<h5>合并之后</h5>
<table border="1" cellspacing="0" width="580" height="320">
<caption>
<strong>个人简介</strong>
</caption>
<tr align="center">
<td>
<strong>姓名:</strong>刘德华
</td>
<td>
<strong>性别:</strong>男
</td>
<td>
<strong>年龄:</strong>61
</td>
<!-- 跨行合并用rowspan,目标单元格 先上后下 -->
<td rowspan="2" width="120">
照片
</td>
</tr>
<tr align="center">
<td>
<strong>身高:</strong>175
</td>
<td>
<strong>民族:</strong>汉
</td>
<td>
<strong>婚姻:</strong>未婚
</td>
<!--多出的部分删除掉 -->
<!-- <td>
照片
</td> -->
</tr>
<tr align="center">
<td>
<strong>个人简介</strong>
</td>
<!-- 跨列合并用colspan,目标单元格 先左后右 -->
<td colspan="3">
个人简介内容
</td>
<!--多出的部分删除掉 -->
<!-- <td>
个人简介内容
</td>
<td>
个人简介内容
</td> -->
</tr>
<tr align="center">
<td>
<strong>个人作品</strong>
</td>
<!-- 跨列合并用colspan,目标单元格 先左后右 -->
<td colspan="3">
个人作品内容
</td>
<!--多出的部分删除掉 -->
<!-- <td>
个人作品内容
</td>
<td>
个人作品内容
</td> -->
</tr>
</table>