HTML <caption> 标签

定义和用法

<caption> 标签定义表格标题。

caption 标签必须紧随 table 标签之后。您只能对每个表格定义一个标题。

提示：默认情况下，表格标题将在表格上方居中对齐。但是，CSS 属性 text-align 和 caption-side 可用于对齐和放置标题。

另请参阅：

HTML DOM 参考手册：Caption 对象

实例

例子 1

带标题的表格：

<table>
  <caption>每月存款</caption>
  <tr>
    <th>月份</th>
    <th>存款</th>
  </tr>
  <tr>
    <td>一月</td>
    <td>￥3000</td>
  </tr>
</table>

亲自试一试

例子 2

定位表的标题（使用 CSS）：

<table>
  <caption style="text-align:right">我的存款</caption>
  <tr>
    <th>月份</th>
    <th>存款</th>
  </tr>
  <tr>
    <td>一月</td>
    <td>￥3000</td>
  </tr>
</table>
<br>

<table>
  <caption style="caption-side:bottom">我的存款</caption>
  <tr>
    <th>月份</th>
    <th>存款</th>
  </tr>
  <tr>
    <td>一月</td>
    <td>￥3000</td>
  </tr>
</table>

亲自试一试

全局属性

<caption> 标签还支持 HTML 中的全局属性。

事件属性

<caption> 标签还支持 HTML 中的事件属性。

默认的 CSS 设置

大多数浏览器将使用以下默认值显示 <caption> 元素：

caption {
  display: table-caption;
  text-align: center;
}

亲自试一试

浏览器支持

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
支持 支持 支持 支持 支持