表格
1.概念
table 是一个复合元素,无法使用单一元素来表示,需要用多个元素来表示;
1.<table> 表格容器;
2.<caption> 表格标题(可选元素);
3. <tr> 表格中的行;
4. <td> \<th> 表格中的列,td与th的差别,th自带居中和加粗属性,一般用于表头;
<!-- <thead>/<tbody>/<tfoot> -->
5.合并行 colspan
6.合并列 rowspan
2.课程表 实践
<table border="1" width="400">
<caption>
初中课程表
</caption>
<!-- 第1行 -->
<tr>
<td></td>
<td></td>
<td>星期一</td>
<td>星期二</td>
<td>星期三</td>
<td>星期四</td>
<td>星期五</td>
</tr>
<!-- 第2行 -->
<tr>
<!-- 从第2行第1列开始,合并5列 -->
<!-- 垂直方向 rowspan-->
<!-- 将合并属性必须添加到第一个td中,并使用第1个td中的数据 -->
<td rowspan="5">上午</td>
<!-- colspan -->
<!-- 从第2行第2列开始,合并6列 -->
<!-- 水平方向 colspan-->
<!-- 将合并属性必须添加到第一个td中,并使用第1个td中的数据 -->
<td colspan="6">早读 7:30~8:10</td>
<!-- <td></td>
<td></td>
<td></td>
<td></td>
<td></td> -->
</tr>
<!-- 第3行 -->
<tr>
<!-- <td></td> -->
<td>一 8:20~9:00</td>
<td>语文</td>
<td>数学</td>
<td>语文</td>
<td>英语</td>
<td>数学</td>
</tr>
<!-- 第4行 -->
<tr>
<!-- <td></td> -->
<td>二 9:10~9:50</td>
<td>英语</td>
<td>语文</td>
<td>英语</td>
<td>物理</td>
<td>英语</td>
</tr>
<!-- 第5行 -->
<tr>
<!-- <td></td> -->
<td>三 10:20~11:00</td>
<td>数学</td>
<td>英语</td>
<td>物理</td>
<td>数学</td>
<td>政治</td>
</tr>
<!-- 第6行 -->
<tr>
<!-- <td></td> -->
<td>四 11:10~11:50</td>
<td>政治</td>
<td>物理</td>
<td>数学</td>
<td>政治</td>
<td>历史</td>
</tr>
<!-- 第7行 -->
<tr>
<!-- 从第7行第1列开始,合并5列 -->
<!-- 重直方向 rowspan-->
<!-- 将合并属性必须添加到第一个td中,并使用第1个td中的数据 -->
-->
<td rowspan="5">下午</td>
<!-- 从第2行第1列开始,合并6行 -->
<!-- 水平方向 colspan-->
<!-- 将合并属性必须添加到第一个td中,并使用第1个td中的数据 -->
<td colspan="6">午读 2:30~3:10</td>
<!-- <td></td>
<td></td>
<td></td>
<td></td>
<td></td> -->
</tr>
<!-- 第8行 -->
<tr>
<!-- <td></td> -->
<td>一 3:20~4:00</td>
<td>物理</td>
<td>生物</td>
<td>阅读</td>
<td>语文</td>
<td>美术</td>
</tr>
<!-- 第9行 -->
<tr>
<!-- <td></td> -->
<td>二 4:10~4:50</td>
<td>音乐</td>
<td>历史</td>
<td>微机</td>
<td>语文</td>
<td>历史</td>
</tr>
<!-- 第10行 -->
<tr>
<!-- <td></td> -->
<td>三 5:00~5:40</td>
<td>地理</td>
<td>体育</td>
<td>地理</td>
<td>生物</td>
<td>体育</td>
</tr>
<!-- 第11行 -->
<tr>
<!-- <td></td> -->
<td>四 5:50~6:30</td>
<td>英语考试</td>
<td>数学</td>
<td>英语</td>
<td>数学</td>
<td>数学考试</td>
</tr>
</table>