HTML 表格

 了解 scope 属性

 <table border="1" width="300" height="200">
        <!-- 表格标题 -->
        <caption>新生报名登记表</caption>
        <!-- 
            定义列样式 
            如果需要应用到每一列，则需要包含span属性
        -->
        <colgroup>
            <col />
            <col style="background-color: yellow" span="2"/>
          </colgroup>
        <thead>
            <!-- 
                scope 属性，可以添加在 <th> 元素中，
                以告诉屏幕阅读器该表头的类型——
                它是所在行的表头，还是所在列的表头
                scope 还有两个可选的值： colgroup 和 rowgroup
                父标题 设置了 scope="colgroup"，则
                子标题 应该有 scope="col" 属性
                rowgroup 同理
             -->
             <th scope="col"></th>
            <th scope="col">姓名</th>
            <th scope="col">性别</th>
            <th scope="col">年龄</th>
            <th scope="col">学费</th>
        </thead>
        <tbody>
            <tr>
                <th scope="row">序号1</th>
                <td>lily</td>
                <td>女</td>
                <td>l8</td>
                <td>100</td>
            </tr>
            <tr>
                <th scope="row">序号2</th>
                <td>maria</td>
                <td>女</td>
                <td>20</td>
                <td>100</td>
            </tr>
            <tr>
                <th scope="row">序号3</th>
                <td>Tom</td>
                <td>男</td>
                <td>22</td>
                <td>100</td>
            </tr>
        </tbody>
        <tfoot>
            <tr>
                <!-- colspan 占多个宽度；rowspan 占多个高度 -->
                <td colspan="4">总计</td>
                <td>300</td>
            </tr>
        </tfoot>
   </table>