<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <!--
        table标签 代表表格
            thead 表头
            tbody 表体
            tfoot 表尾
        tr 表示一行
          td 表示行内的一个单元格
          th 一种带有加粗和居中效果的td       
     -->
    <h3>成绩排名表</h3>
    <!-- 可以通过border设置边框 -->
    <table border="1px">
        <thead>
            <tr>
                <th>排名</th>
                <th>姓名</th>
                <th>分数</th>
                <th>说明</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>1</td>
                <td>张三</td>
                <td>100</td>
                <!-- 可以使用rowspan将多行合并到一起 -->
                <td rowspan="5">前三名有奖学金</td>
            </tr>
            <tr>
                <td>2</td>
                <td>李四</td>
                <td>99</td>
                <!-- <td>前三名有奖学金</td> -->
            </tr>
            <tr>
                <td>3</td>
                <td>王五</td>
                <td>98</td>
                <!-- <td>前三名有奖学金</td> -->
            </tr>
            <tr>
                <td>最高分</td>
                <!-- 使用colspan将多列合并到一起 值对应要合并的列数 -->
                <td colspan="2">100</td>
                <!-- <td>100</td> -->
            </tr>
            <tr>
                <td>平均分</td>
                <td colspan="2">99</td>
                <!-- <td>99</td> -->
            </tr>
        </tbody>
    </table>
</body>

</html>