HTML caption tag

Example

A table with a caption:

<table>
<caption>Monthly savings</caption>
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
</tr>
</table>

Monthly savings
Month Savings
January $100

Definition and Usage

The <caption> tag defines a table caption.

The <caption> tag must be inserted immediately after the <table> tag.

Tip: By default, a table caption will be center-aligned above a table. However, the CSS properties text-align and caption-side can be used to align and place the caption.

Global Attributes

The <caption> tag also supports the Global Attributes in HTML.

Event Attributes

The <caption> tag also supports the Event Attributes in HTML.

More Examples

Example

Position table captions (with 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>

My savings
Month Savings
January $100

Default CSS Settings

Most browsers will display the <caption> element with the following default values:

Example

caption {
display: table-caption;
text-align: center;
}

Comments