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
支持 支持 支持 支持 支持