1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
|
---
title: <caption>
slug: Web/HTML/Element/caption
translation_of: Web/HTML/Element/caption
---
<h2 id="简介">简介</h2>
<p><strong>HTML <code><caption></code> 元素</strong> (or <em>HTML 表格标题元素</em>) 展示一个表格的标题， 它常常作为 {{HTMLElement("table")}} 的第一个子元素出现，同时显示在表格内容的最前面，但是，它同样可以被 CSS 样式化，所以，它同样可以出现在任何一个一个相对于表格的做任意位置。</p>
<table class="properties">
<tbody>
<tr>
<th scope="row"><a href="/en-US/docs/HTML/Content_categories" title="HTML/Content_categories">Content categories</a></th>
<td>None.</td>
</tr>
<tr>
<th scope="row">Permitted content</th>
<td><a href="/en-US/docs/HTML/Content_categories#Flow_content" title="HTML/Content categories#Flow content">Flow content</a>.</td>
</tr>
<tr>
<th scope="row">Tag omission</th>
<td>{{no_tag_omission}}</td>
</tr>
<tr>
<th scope="row">Permitted parent elements</th>
<td>A {{HTMLElement("table")}} element, as its first descendant.</td>
</tr>
<tr>
<th scope="row">DOM interface</th>
<td>{{domxref("HTMLTableCaptionElement")}}</td>
</tr>
</tbody>
</table>
<h2 id="特性">特性</h2>
<p>本元素包含了所有 <a href="https://developer.mozilla.org/en-US/docs/HTML/Global_attributes" title="HTML/Global attributes">全局特性</a>。</p>
<dl>
<dt>{{htmlattrdef("align")}} {{deprecatedGeneric('inline','HTML4.01')}} {{obsoleteGeneric('inline','HTML5')}}</dt>
<dd>这个可枚举属性表明了 caption 相对于 table 应该如何排列。它可能有以下几个值：
<ul>
<li><code>left</code>, 展示在表格左边</li>
<li><code>top</code>, 显示在表格前面</li>
<li><code>right</code>, 显示在表格右边</li>
<li><code>bottom</code>, 显示在表格下面</li>
</ul>
<div class="note"><strong>使用说明：</strong>不要使用这个属性，它已经被弃用： {{HTMLElement("caption")}} 元素应该使用 <a href="/en-US/docs/CSS" title="CSS">CSS</a>设置样式。要得到类似<code>align</code>属性的效果，使用 <a href="/en-US/docs/CSS" title="CSS">CSS</a> 属性 {{cssxref("caption-side")}} 和 {{cssxref("text-align")}}.</div>
</dd>
</dl>
<h2 id="使用说明">使用说明</h2>
<p>当 {{HTMLElement("table")}} 元素是{{HTMLElement("caption")}} 的父元素，caption 是{{HTMLElement("figure")}} 元素的唯一后代的时候，使用{{HTMLElement("figcaption")}}元素替代 caption 元素</p>
<h2 id="实例">实例</h2>
<p>请查看 {{HTMLElement("table")}} 页面获得 {{HTMLElement("caption")}}的例子</p>
<h2 id="Specifications" name="Specifications">Specifications</h2>
<table class="standard-table">
<thead>
<tr>
<th scope="col">Specification</th>
<th scope="col">Status</th>
<th scope="col">Comment</th>
</tr>
</thead>
<tbody>
<tr>
<td>{{SpecName('HTML WHATWG', 'tabular-data.html#the-caption-element', '<caption>')}}</td>
<td>{{Spec2('HTML WHATWG')}}</td>
<td> </td>
</tr>
<tr>
<td>{{SpecName('HTML5 W3C', 'tabular-data.html#the-caption-element', '<caption>')}}</td>
<td>{{Spec2('HTML5 W3C')}}</td>
<td> </td>
</tr>
<tr>
<td>{{SpecName('HTML4.01', 'struct/tables.html#h-11.2.2', '<caption>')}}</td>
<td>{{Spec2('HTML4.01')}}</td>
<td> </td>
</tr>
</tbody>
</table>
<h2 id="Browser_compatibility">Browser compatibility</h2>
<p>{{CompatibilityTable}}</p>
<div id="compat-desktop">
<table class="compat-table">
<tbody>
<tr>
<th>Feature</th>
<th>Chrome</th>
<th>Firefox (Gecko)</th>
<th>Internet Explorer</th>
<th>Opera</th>
<th>Safari</th>
</tr>
<tr>
<td>Basic support</td>
<td>{{CompatVersionUnknown}}</td>
<td>{{CompatGeckoDesktop("1.0")}}</td>
<td>{{CompatVersionUnknown}}</td>
<td>{{CompatVersionUnknown}}</td>
<td>{{CompatVersionUnknown}}</td>
</tr>
</tbody>
</table>
</div>
<div id="compat-mobile">
<table class="compat-table">
<tbody>
<tr>
<th>Feature</th>
<th>Android</th>
<th>Firefox Mobile (Gecko)</th>
<th>IE Mobile</th>
<th>Opera Mobile</th>
<th>Safari Mobile</th>
</tr>
<tr>
<td>Basic support</td>
<td>{{CompatVersionUnknown}}</td>
<td>{{CompatGeckoMobile("1.0")}}</td>
<td>{{CompatVersionUnknown}}</td>
<td>{{CompatVersionUnknown}}</td>
<td>{{CompatVersionUnknown}}</td>
</tr>
</tbody>
</table>
</div>
<h2 id="See_also">See also</h2>
<ul>
<li>其他与 table 相关的 HTML 元素: {{HTMLElement("col")}}, {{HTMLElement("colgroup")}}, {{HTMLElement("table")}}, {{HTMLElement("tbody")}}, {{HTMLElement("td")}}, {{HTMLElement("tfoot")}}, {{HTMLElement("th")}}, {{HTMLElement("thead")}}, {{HTMLElement("tr")}};</li>
<li>可能对{{HTMLElement("caption")}} 元素有用的 CSS 属性：
<ul>
<li>{{cssxref("text-align")}}, {{cssxref("caption-side")}}.</li>
</ul>
</li>
</ul>
<p>{{HTMLRef}}</p>
|
