代码语言：javascript复制
<html>
<head>
<meta charset = "utf-8">
<title>表格测试</title>
</head>
<body>
<h3>这是一个表格</h3>
<table border = "1px" cellspacing = "0px">
<!--col （column列的缩写）这是一个单标签，决定每一列
<col width = "300px">
<col width = "300px">
<col width = "300px">
<col width = "400px">
单独设定每一列很不方便，可以使用colgroup标签，将连续相同列数的设定为一个组，设定一个宽度
<colgroup span="3" width="300px">
<colgroup span="1" width="400px">-->
<colgroup span="3" width="300px">
<colgroup span="1" width="400px">
<!--一行中所有的文字都需要居中或左或右给tr行设定就可以，不需要给每个单元格设定-->>
<tr>
<!--合并单元格本质上是去掉其他几个单元格，将第一个单元格的长度设置为要合并后所占的长度
colspan标签，要占据几列的单元格;
rowspan:占据几行-->>
<!--th=加粗并水平居中的td-->>
<th colspan="4">表格第1行做一个合并单元格</th>
</tr>
<tr>
<td align="center">表格第2行第1列...</td>
<td>表格第2行第2列...</td>
<td>表格第2行第3列...</td>
<td rowspan="2">表格第2行第4列...</td>
</tr>
<tr>
<td align="right">表格第3行第1列</td>
<td colspan="2" align="center">表格第3行第2列和第三列合并单元格</td>
<!--被第二行第4列合并掉<td>表格第3行第4列......</td>-->
</tr>
</table>
</body>
</html>
