<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>表格</title>
</head>
<body>
<!--
作者：[email protected]
时间：2020-02-20
描述：table：表格标签
tr:行标签
td:单元格标签
-->
<table border="1">
<!--
作者：[email protected]
时间：2020-02-20
描述：表头的表格用th定义标签
caption 标题标签
-->
<caption><h3>学生信息表</h3></caption>
<tr>
<th>姓名</th>
<th>学校</th>
<th>性别</th>
<th>班级</th>
</tr>
<tr>
<td>张三</td>
<td>南开大学</td>
<td>男</td>
<td>研一</td>
</tr>
<tr>
<td>赵四</td>
<td>山东大学</td>
<td>男</td>
<td>研一</td>
</tr>
</table>
</body>
</html>
下面展示一个居中表格的实例下带有注释
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>学生成绩表</title>
<style>
table{
width:500px;
text-align: center;/*设置字体居中*/
margin:0 auto;/*body居中*/
}
table,th,td{
border-collapse: collapse;/*表示把所有table，th，td标签边框合并*/
}
</style>
</head>
<body>
<table border="1">
<caption>学生成绩表</caption>
<tr>
<th>学号</th>
<th>高数</th>
<th>英语</th>
<th>政治</th>
</tr>
<tr>
<td>1001</td>
<td>100</td>
<td>20</td>
<td>30</td>
</tr>
<tr>
<td>1002</td>
<td>100</td>
<td>100</td>
<td>100</td>
</tr>
<tr>
<td>1003</td>
<td>100</td>
<td>80</td>
<td>70</td>
</tr>
</table>
</body>
</html>
