表格标签

表格标签

标签：table 嵌套 tr， tr 嵌套 td/th

提示：在网页中，表格默认没有边框线，使用 border 属性可以为表格添加边框线。文章源自十年又十年-https://www.bbigsun.com/872.html

<table border="1">
    <tr>
        <th>姓名</th>
        <th>性别</th>
        <th>年龄</th>
    </tr>
    <tr>
        <th>小明</th>
        <th>男</th>
        <th>20</th>
    </tr>
    <tr>
        <th>小红</th>
        <th>女</th>
        <th>18</th>
    </tr>
    <tr>
        <th>小芬</th>
        <th>女</th>
        <th>22</th>
    </tr>
</table>

文章源自十年又十年-https://www.bbigsun.com/872.html

表格结构标签

作用：用表格结构标签把内容划分区域，让表格结构更清晰，语义更清晰。文章源自十年又十年-https://www.bbigsun.com/872.html

合并单元格

将多个单元格合并成一个单元格，以合并同类信息文章源自十年又十年-https://www.bbigsun.com/872.html

合并单元格步骤：文章源自十年又十年-https://www.bbigsun.com/872.html

1. 明确合并的目标
2. 保留最左上角的单元格，添加属性（取值为数字，表示需要合并的单元格数量）
   • 跨行合并：保留最上单元格，添加属性 rowspan
   • 跨列合并：保留最左单元格，添加属性 colspan
3. 删除其他单元格

<table border="1">
    <tr>
        <th colspan="3">学生信息</th>
    </tr>
    <tr>
        <th>姓名</th>
        <th>性别</th>
        <th>年龄</th>
    </tr>
    <tr>
        <th>小明</th>
        <th>男</th>
        <th>20</th>
    </tr>
    <tr>
        <th>小红</th>
        <th rowspan="2">女</th>
        <th>18</th>
    </tr>
    <tr>
        <th>小芬</th>
        <th>22</th>
    </tr>

</table>

文章源自十年又十年-https://www.bbigsun.com/872.html 文章源自十年又十年-https://www.bbigsun.com/872.html