前端——简单页面设计练习1——课程表

最新推荐文章于 2024-07-23 13:42:12 发布

Seer666

最新推荐文章于 2024-07-23 13:42:12 发布

阅读量1.5k

点赞数 1

分类专栏：前端练习文章标签：前端页面设计小练习

本文链接：https://blog.csdn.net/Seer666/article/details/100023632

版权

前端练习专栏收录该内容

2 篇文章 0 订阅

订阅专栏

在这里插入图片描述

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <table>
        <caption>课程表</caption>
        <tr>
            <td colspan="2"></td>
            <th>星期一</th>
            <th>星期二</th>
            <th>星期三</th>
            <th>星期四</th>
            <th>星期五</th>
        </tr>
        <tr>
            <td rowspan="2">上午</td>
            <td>1</td>
            <td>Data</td>
            <td>Data</td>
            <td>Data</td>
            <td>Data</td>
            <td>Data</td>
        </tr>
        <tr>
            <td>2</td>
            <td>Data</td>
            <td>Data</td>
            <td>Data</td>
            <td>Data</td>
            <td>Data</td>
        </tr>
        <tr>
            <td rowspan="2">下午</td>
            <td> 1 </td>
            <td>Data</td>
            <td>Data</td>
            <td>Data</td>
            <td>Data</td>
            <td>Data</td>
        </tr>
        <tr>
            <td> 2 </td>
            <td>Data</td>
            <td>Data</td>
            <td>Data</td>
            <td>Data</td>
            <td>Data</td>
        </tr>
    </table>
    <style>
        table{
            width: 400px;
            height: 200px;
            text-align: center;
            border-collapse: collapse;
            border: 1px solid green;


        table-layout:auto;
        empty-cells: hide;
    }
        table tr th,
        table tr td{
            border: 1px solid green;
        }  
        
    }
</style>

</body>
</html>```