表格合并列
Colspan=“所要合并的单元格的列数”必须给td。
![](https://i-blog.csdnimg.cn/blog_migrate/567eb89908e2c21a3c3b6d9184051d59.png)
表格合并行
Rowspan=“所要合并的单元格的行数”必须给td。
![](https://i-blog.csdnimg.cn/blog_migrate/569f0d49f69522e6a3225bdd8649bfb3.png)
3.代码演示及效果图
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<!-- 表格合并 -->
<!-- 1.创建表格 -->
<table border="1" width="500px" height="100px"
align="center" bordercolor="black" bgcolor="white"
cellspacing="5" cellpadding="5">
<!-- 2.创建行 -->
<tr >
<!-- 3.创建单元格 -->
<td>安琪拉</td>
<td>亚瑟</td>
<td>兰陵王</td>
<td>后裔</td>
<td>蔡文姬</td>
</tr>
<tr >
<td>王昭君</td>
<td>钟无艳</td>
<td>澜</td>
<td>伽罗</td>
<td>钟馗</td>
</tr>
</table>
</body>
</html>
开局效果图
![](https://i-blog.csdnimg.cn/blog_migrate/03d2555169f37a17f547c934ef0ab97b.png)
中路:安琪拉VS王昭君,假设安琪拉赢了
<!-- 2.创建行 -->
<tr >
<!-- 3.创建单元格 -->
<td rowspan="2">安琪拉</td>
<td>亚瑟</td>
<td>兰陵王</td>
<td>后裔</td>
<td>蔡文姬</td>
</tr>
<tr >
<!-- <td>王昭君</td> -->
<td>钟无艳</td>
<td>澜</td>
<td>伽罗</td>
<td>钟馗</td>
</tr>
效果图
![](https://i-blog.csdnimg.cn/blog_migrate/c7d850f5630d0fe3583fa56c7b94115a.png)
发育路:后裔跟奶妈吵架了,导致奶妈挂机。
<!-- 2.创建行 -->
<tr >
<!-- 3.创建单元格 -->
<td rowspan="2">安琪拉</td>
<td>亚瑟</td>
<td>兰陵王</td>
<td colspan="2">后裔</td>
<!-- <td>蔡文姬</td> -->
</tr>
<tr >
<!-- <td>王昭君</td> -->
<td>钟无艳</td>
<td>澜</td>
<td>伽罗</td>
<td>钟馗</td>
</tr>
效果图
![](https://i-blog.csdnimg.cn/blog_migrate/b237a6f63a6adcbc372bc22671323bbe.png)