<!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>用表格实现一张课程表</title>
</head>
<body>
<!-- table中的属性,如 border,width,cellspacing...均已废止,推荐用css控制,这里仅做演示,后面不再使用 -->
<table
border="1"
width="500px"
align="center"
cellspacing="0"
cellpadding="5"
>
<!-- 表格标题 -->
<caption>
<p style="font-size: 30px">重庆市X小学课程表</p>
</caption>
<!-- 表头 -->
<thead>
<tr>
<th>时间</th>
<th>星期一</th>
<th>星期二</th>
<th>星期三</th>
<th>星期四</th>
<th>星期五</th>
</tr>
</thead>
<!-- 表体 -->
<tbody align="center">
<!-- 上午 -->
<tr>
<td rowspan="4" bgcolor="#e7f7f7">上午</td>
<td>语文</td>
<td>数学</td>
<td>英语</td>
<td>物理</td>
<td>化学</td>
</tr>
<tr>
<td>历史</td>
<td>地理</td>
<td>政治</td>
<td>美术</td>
<td>体育</td>
</tr>
<tr>
<td>数学</td>
<td>历史</td>
<td>化学</td>
<td>英语</td>
<td>语文</td>
</tr>
<tr>
<td>英语</td>
<td>数学</td>
<td>语文</td>
<td>化学</td>
<td>物理</td>
</tr>
<tr>
<td colspan="6" bgcolor="#e5e5e5">中午休息</td>
</tr>
<!-- 下午 -->
<tr>
<td rowspan="3" bgcolor="#e7f7f7">下午</td>
<td>生物</td>
<td>地理</td>
<td>历史</td>
<td>数学</td>
<td>语文</td>
</tr>
<tr>
<td>体育</td>
<td>美术</td>
<td>计算机</td>
<td>音乐</td>
<td>数学</td>
</tr>
<tr>
<td>语文</td>
<td>化学</td>
<td>物理</td>
<td>生物</td>
<td>地理</td>
</tr>
</tbody>
<!-- 表尾 -->
<tfoot align="center">
<tr>
<td colspan="6" bgcolor="#e5e5e5">放学</td>
</tr>
</tfoot>
</table>
</body>
</html>