1017作业——课程表

课程表

作业说明

• 本次作业选择课程表完成
• 以时间节点为基础
• 使用简单css样式美化表格背景和居中
• 有使用行与列的合并

---

代码如下：

<!-- 课程表 -->
    <table border="1" style="text-align: center;">
        <caption >课程表</caption>
        <!-- 表头 时间 课程 -->
        <thead style="background-color: #F0FFFF;">
            <tr>
              <th colspan="3">时间</th>
              <th colspan="5">课程</th>
            </tr>
        </thead>
        <!-- 表体 上午,下午,星期,具体课程 -->
        <tbody>
            <tr>
                <td rowspan="8" style="background-color: Beige ;">上午</td>
                <td colspan="2">时间</td>
                <td>星期一</td>
                <td>星期二</td>
                <td>星期三</td>
                <td>星期四</td>
                <td>星期五</td>     
            </tr>
            <tr>
                <!-- <td></td> -->
                <td>8:05-8:40</td>
                <td>第一节</td>
                <td>班会</td>
                <td>语文</td>
                <td>语文</td>
                <td>数学</td>
                <td>数学</td>
            </tr>
            <tr>
                <!-- <td></td> -->
                <td>8:50-9:25</td>
                <td>第二节</td>
                <td>语文</td>
                <td>语文</td>
                <td>语文</td>
                <td>数学</td>
                <td>数学</td>
            </tr>
            <tr>
                <!-- <td></td> -->
                <td>9:25-9:55</td>
                <td colspan="6">课间操</td>
            </tr>
            <tr>
                <!-- <td></td> -->
                <td>9:55-10:30</td>
                <td>第三节</td>
                <td>英语</td>
                <td>美术</td>
                <td>数学</td>
                <td>体育</td>
                <td>英语</td>
            </tr>
            <tr>
                <!-- <td></td> -->
                <td>10:30-10:45</td>
                <td colspan="5">眼保健操</td>
            </tr>
            <tr>
                <!-- <td></td> -->
                <td>10:45-11:20</td>
                <td>第四节</td>
                <td>数学</td>
                <td>语文</td>
                <td>英语</td>
                <td>数学</td>
                <td>品德</td>
            </tr>
            <tr>
                <!-- <td></td> -->
                <td>11:30-12:05</td>
                <td>第五节</td>
                <td>数学</td>
                <td>英语</td>
                <td>英语</td>
                <td>文体</td>
                <td>书法</td>
            </tr>
            <tr>
                <td style="background-color: Beige;">中午</td>
                <td>12:05-14:45</td>
                <td colspan="6">午休</td>
            </tr>
            <tr>
                <td rowspan="3" style="background-color: Beige;">下午</td>
                <!-- <td colspan="2">时间</td> -->
            </tr>
            <tr>
                <!-- <td></td> -->
                <td>14:45-15:20</td>
                <td>第六节</td>
                <td>信息技术</td>
                <td>体育</td>
                <td>英语</td>
                <td>音乐</td>
                <td>体育</td>     
            </tr>
            <tr>
                <!-- <td></td> -->
                <td>13:35-16:10</td>
                <td>第7节</td>
                <td>政治</td>
                <td>劳动</td>
                <td>体育</td>
                <td>音乐</td>
                <td>音乐</td>     
            </tr>
        </tbody>
    </table>

具体表格渲染如下图：