Show me the code
将代码复制保存为.html
结尾的文件并用浏览器产看结果。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>表格</title>
</head>
<body>
<h1>HTML表格</h1>
<h2>利用table内含tr内含td标签创建一个三行三列的表格</h2>
<table align="center">
<caption>这是caption标签添加的表名</caption>
<thead>
<tr>
<td>外包thead标签的表头1</td>
<td>外包thead标签的表头2</td>
<td>外包thead标签的表头2</td>
</tr>
</thead>
<tbody>
<tr>
<td>内容11</td>
<td>内容12</td>
<td>内容13</td>
</tr>
<tr>
<td>内容21</td>
<td>内容22</td>
<td>内容23</td>
</tr>
</tbody>
</table>
<h2>利用boder= “1”属性设置边框,cellspacing= "1"属性调整边框距离,cellpadding= "1"属性调整内容距离</h2>
<table align="center" cellspacing="1" cellspadding= "1" border="1">
<caption>这是caption标签添加的表名</caption>
<thead>
<tr>
<td>外包thead标签的表头1</td>
<td>外包thead标签的表头2</td>
<td>外包thead标签的表头2</td>
</tr>
</thead>
<tbody>
<tr>
<td>内容11</td>
<td>内容12</td>
<td>内容13</td>
</tr>
<tr>
<td>内容21</td>
<td>内容22</td>
<td>内容23</td>
</tr>
</tbody>
</table>
<h2>利用rowspan属性合并行</h2>
<table align="center" cellspacing="1" cellspadding= "1" border="1">
<caption>这是caption标签添加的表名</caption>
<thead>
<tr>
<td>外包thead标签的表头1</td>
<td>外包thead标签的表头2</td>
<td>外包thead标签的表头2</td>
</tr>
</thead>
<tbody>
<tr>
<td rowspan="2">rowspan合并后内容</td>
<td>内容12</td>
<td>内容13</td>
</tr>
<tr>
<td>内容22</td>
<td>内容23</td>
</tr>
</tbody>
</table>
<h2>利用colspan属性合并列</h2>
<table align="center" cellspacing="1" cellspadding= "1" border="1">
<caption>这是caption标签添加的表名</caption>
<thead>
<tr>
<td>外包thead标签的表头1</td>
<td>外包thead标签的表头2</td>
<td>外包thead标签的表头2</td>
</tr>
</thead>
<tbody>
<tr>
<td>内容11</td>
<td>内容12</td>
<td>内容13</td>
</tr>
<tr>
<td>内容21</td>
<td colspan="2">colspan合并内容</td>
</tr>
</tbody>
</table>
</body>
</html>