HTML th 标签

HTML th 语法

在 HTML 中,th 标签用于定义表格的表头行单元格。它通常与 tr 标签一起使用,从而定义表头的一行数据。

语法:

<tr>
    <th>单元格1</th>
    <th>单元格2</th>
</tr>

说明:

th 标签必须放在 tr 标签的内部使用。

提示:

  • th 是 “table header cell(表头单元格)” 的缩写。
  • th 用于表示表头行单元格,而 td 用于表示正文行单元格。

HTML th 摘要

属于 HTML 表格
使用频率
兼容性 查看
官方文档 查看
MDN 查看

HTML th 示例

接下来,我们通过一个简单的例子来讲解一下 HTML th 标签是如何使用的。

示例:th 标签的基本用法

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title></title>
    <style>
        /* 使用CSS为表格加上边框 */
        table, tr, td, th { border: 1px solid silver; }
    </style>
</head>
<body>
    <table>
        <caption>考试成绩表</caption>
        <tr>
            <th>姓名</th>
            <th>语文</th>
            <th>英语</th>
            <th>数学</th>
        </tr>
        <tr>
            <td>小明</td>
            <td>80</td>
            <td>80</td>
            <td>80</td>
        </tr>
        <tr>
            <td>小红</td>
            <td>90</td>
            <td>90</td>
            <td>90</td>
        </tr>
        <tr>
            <td>小杰</td>
            <td>100</td>
            <td>100</td>
            <td>100</td>
        </tr>
    </table>
</body>
</html>

页面效果如下图所示。

HTML th标签示例

分析:

默认情况下,th 标签内的文本会加粗显示。

上一篇: tr

下一篇: td

给站长反馈

绿叶网正在不断完善中,小伙伴们如果发现任何问题,还望多多给站长反馈,谢谢!

邮箱:lvyenet@vip.qq.com

「绿叶网」服务号
绿叶网服务号放大
关注服务号,微信也能看教程。
绿叶网服务号