【HTML基础练习02】课程表

最新推荐文章于 2024-11-01 15:19:31 发布

啥也不会的Taio

最新推荐文章于 2024-11-01 15:19:31 发布

阅读量101

点赞数

文章标签： html 前端

本文链接：https://blog.csdn.net/Taio9648/article/details/125031657

版权

示例图片：

练习内容：表格合并单元格、设置边距的操作

需要练习使用以下标签

cellPadding 内边距
cellspacing 外边距
colspan 列合并
rowspan 行合并
bgcolor 背景颜色

示例代码：

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
    </head>

    <body align="center">
        <h3>课程表</h3>
        <table border="1" cellPadding="20px" cellspacing="0" align="center" >
            <tr>
                <td width="70">项目</td>
                <td colspan="5" width="100">上课</td>
                <td colspan="2" width="100">休息</td>
            </tr>

            <tr bgcolor="ffeee3">
                <td>星期</td>
                <td>星期二</td>
                <td>星期三</td>
                <td>星期四</td>
                <td>星期五</td>
                <td>星期六</td>
                <td>星期日</td>
            </tr>

            <tr>
                <td rowspan="4">上午</td>
                <td>语文</td>
                <td>数学</td>
                <td>英语</td>
                <td>英语</td>
                <td>计算机</td>
                <td rowspan="4">休息</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 rowspan="2">下午</td>
                <td>语文</td>
                <td>数学</td>
                <td>英语</td>
                <td>英语</td>
                <td>计算机</td>
                <td rowspan="2">休息</td>
            </tr>

            <tr>
                <td>语文</td>
                <td>数学</td>
                <td>英语</td>
                <td>英语</td>
                <td>计算机</td>
            </tr>
        </table>
    </body>
</html>