轻松上手,快乐学习!

HTML <caption> 标签



实例

有标题的表格:

<table>
  <caption>Monthly savings</caption>
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td>January</td>
    <td>$100</td>
  </tr>
</table>
亲自试一试 »

下面有更多实例。


定义和用法

<caption> 元素定义表格标题。

<caption> 标签必须紧随 <table> 标签之后。您只能对每个表格定义一个标题。通常这个标题会被居中于表格之上。

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


浏览器支持

元素
<caption> Yes Yes Yes Yes Yes

全局属性

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


事件属性

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


更多实例

实例

定位表格标题 (使用 CSS):

<table>
  <caption style="text-align:right">My savings</caption>
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td>January</td>
    <td>$100</td>
  </tr>
</table>
<br>

<table>
  <caption style="caption-side:bottom">My savings</caption>
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td>January</td>
    <td>$100</td>
  </tr>
</table>
亲自试一试 »

相关页面

HTML DOM 参考手册: Caption 对象


默认CSS设置

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

实例

caption {
  display: table-caption;
  text-align: center;
}
亲自试一试 »