caption (HTML element)
| Depr. | Empty | Version |
|---|---|---|
| No | No | HTML 3.2 |
| IE5.5+ | FF1+ | SA1.3+ | OP9.2+ |
|---|---|---|---|
| Partial | Full | Partial | Partial |
Syntax
Description
The caption
element provides a means for labeling the following table’s content in a
visual manner (unlike the table’s
summary attribute, which is non-visible). It
has one element-specific attribute, align,
which is very rudimentary and not entirely supported (it’s also
deprecated, so it should generally be avoided).
The
caption element can only be used once per
table and must immediately follow the
table start tag.
While the
caption element seems like the most appropriate markup
for labeling a table, many people instead choose to
precede tables with heading elements 1-6 (for example, an h3 element). This makes it easier for people using assistive
technology, such as screen readers, to jump from heading to heading in the
document, and arguably offers more semantic information than the
caption, which doesn’t provide any indication of
importance or hierarchy within the document.
Example
Here’s a table
caption that provides a visual summary and heading all
in one:
<table border="1">
<caption>Interest Rates for Young Saver Accounts</caption>
<tr>
<th>Account Type</th>
<th>Interest Rate</th>
</tr>
<tr>
<td>Smart</td>
<td>From 2%</td>
</tr>
<tr>
<td>Young Saver</td>
<td>From 1.6%</td>
</tr>
</table>
Use This For …
This element should be used
for providing a short heading for the table; it should not be used to
provide a description of the table’s structure, as you might do with the
table summary
attribute.
Compatibility
| Internet Explorer | Firefox | Safari | Opera | |||||||
|---|---|---|---|---|---|---|---|---|---|---|
| 5.5 | 6.0 | 7.0 | 1.0 | 1.5 | 2.0 | 1.3 | 2.0 | 3.0 | 9.2 | 9.5 |
| Partial | Partial | Partial | Full | Full | Full | Partial | Partial | Partial | Partial | Partial |
As long as you steer
clear of the align attribute, browser support for
caption is generally good. It can be problematic to
style this element with CSS, though, unlike headings 1-6, which is another
reason why the caption element isn’t used very
frequently.
In this Section
align
defines the alignment or position of thetable’scaptionelement, relative to thetable
User-contributed notes
- ID:
- #1
- Date:
- Fri, 28 Mar 2008 12:33:54 GMT
Captions and headings are different beasts. A heading is a summary of the content that follows (until the next heading on the same, or a superior, level). A caption labels a table, much like the 'Figure' captions used for illustrations in this reference.
In textbooks, table captions are often placed below the table rather than above it, which may explain why may authors don't make the connection with the CAPTION element type.
Add a note
To post a note on this topic, please log in with your SitePoint username and password. If you don't have an account yet, you can create a new account for free.