HTML 参考手册

HTML 标签大全

HTML: <caption> 标签

HTML <caption>标签定义HTML文档中表的标题。传统上,浏览器会渲染表格上方 <caption>标签中找到的文本,但是您可以使用CSS caption-side属性更改此行为。此标签通常也称为 <caption>元素。

HTML <caption> 元素 (or HTML 表格标题元素) 展示一个表格的标题, 它常常作为 <table> 的第一个子元素出现,同时显示在表格内容的最前面,但是,它同样可以被CSS样式化,所以,它同样可以出现在任何一个一个相对于表格的做任意位置。

在线示例

带有caption标题的表格:

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>鸟哥教程(niaoge.com)</title> 
</head>
<body>
<table>
  <caption>This is the caption for the table</caption>
  <tr>
    <th>Column 1 Heading</th>
    <th>Column 2 Heading</th>
    <th>Column 3 Heading</th>
  </tr>
  <tr>
    <td>Data in Column 1, Row 2</td>
    <td>Data in Column 2, Row 2</td>
    <td>Data in Column 3, Row 2</td>
  </tr>
  <tr>
    <td>Data in Column 1, Row 3</td>
    <td>Data in Column 2, Row 3</td>
    <td>Data in Column 3, Row 3</td>
  </tr>
  <tr>
    <td>Data in Column 1, Row 4</td>
    <td>Data in Column 2, Row 4</td>
    <td>Data in Column 3, Row 4</td>
  </tr>
</table>
</body>
</html>
测试看看 ‹/›
在此HTML5文档示例中,我们使用<table>标签创建了一个表。<table>标记的第一个是<caption>。然后该表具有3列和4行。表的第1行是使用第一个<tr>标记定义的。它具有3个使用<th>标记定义的表标题单元格。该表的第2至4行使用<td>标记定义标准表单元格。

浏览器兼容性

IEFirefoxOperaChromeSafari

所有主流浏览器都支持 <caption> 标签。

标签定义及使用说明

HTML <caption>元素位于<body>标记内。
<caption>标记是在<table>标记之后出现的第一个标记。

<table>标记由<tr>,<th>和<td>标记组成。

大多数浏览器将在表格上方呈现<caption>标记,但是您可以使用CSS caption-side属性更改此行为。

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

<caption> 标签必须直接放置到 <table> 标签之后。

注意:每个表格只能指定一个标题。

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

HTML 4.01 与 HTML5之间的差异

align属性已从HTML5中删除。

属性

属性描述
alignleft
right
top
bottom

HTML5 不支持。HTML 4.01 已废弃。    定义标题的对齐方式。
它可以是以下值之一:
left-表示标题出现在表格
top -表示标题出现在表格
right -表示标题出现在表格
bottom -表示标题出现在表格底部的下方表

全局属性

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

事件属性

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