软件测试之前端学习之表格

开心呆哥

已于 2022-10-09 16:01:29 修改

阅读量245

点赞数

分类专栏：技术脚本代码程序元

于 2022-09-11 15:49:37 首次发布

本文链接：https://blog.csdn.net/qq_42206726/article/details/126805932

版权

学习前端

技术同时被 3 个专栏收录

18 篇文章 0 订阅

订阅专栏

程序元

13 篇文章 0 订阅

订阅专栏

脚本代码

6 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>我是测试表格</title>
    </head>
    <style>
        .table-div{
            text-align: center;
            width: 235px;
        }
        table{
            background-color: lightpink;
            text-align: center;
        }
        .table-p1{
            text-align: center;
            font-size: 25px;
            height: 10px;
        }
        .table-td1{
            background-color: lightpink;
            width: 75px;
            
        }
        .table-title{
            background-color: cornflowerblue;
            height: 50px;
            font-size: 30px;
        }
        .table-td6{
            background-color: green;
        }
        .table-td7{
            background-color: goldenrod;
        }
    </style>
    <body>
        <div class="table-div">
                <p class="table-p1"><b>创建表格</b></p>
            <table border="1">
                <tr>
                    <td colspan="3" class="table-title"><b>数字表格</b></td>
                </tr>
                <tr>
                    <td class="table-td1">1</td>
                    <td class="table-td1">2</td>
                    <td class="table-td1">3</td>
                </tr>
                <tr>
                    <td class="table-td1">4</td>
                    <td class="table-td1">5</td>
                    <td rowspan="2" class="table-td6">6</td>
                </tr>
                <tr>
                    <td colspan="2" class="table-td7">7</td>
                </tr>
            </table>
        </div>
    </body>
</html>