Etiqueta HTML <caption>

Definição e uso

<caption> A tag define o título da tabela.

A tag caption deve seguir imediatamente a tag table. Você pode definir apenas um título para cada tabela.

Dica:Por padrão, o título da tabela será alinhado no centro acima da tabela. No entanto, as propriedades CSS text-align e caption-side podem ser usadas para alinhar e posicionar o título.

Veja também:

Manual de Referência do DOM HTML:Objeto Caption

Exemplo

Exemplo 1

Tabela com título:

<table>
  <caption>Depósitos Mensais</caption>
  <tr>
    <th>Mês</th>
    <th>Depósito</th>
  </tr>
  <tr>
    <td>Um mês</td>
    <td>￥3000</td>
  </tr>
</table>

Experimente você mesmo

Exemplo 2

Título da tabela (usando CSS):

<table>
  <caption style="text-align:right">Minha Conta</caption>
  <tr>
    <th>Mês</th>
    <th>Depósito</th>
  </tr>
  <tr>
    <td>Um mês</td>
    <td>￥3000</td>
  </tr>
</table>
<br>
<table>
  <caption style="caption-side:bottom">Meus depósitos</caption>
  <tr>
    <th>Mês</th>
    <th>Depósito</th>
  </tr>
  <tr>
    <td>Um mês</td>
    <td>￥3000</td>
  </tr>
</table>

Experimente você mesmo

Atributos globais

<caption> A tag também suporta Atributos globais no HTML.

Atributos de evento

<caption> A tag também suporta Atributos de evento no HTML.

Configurações CSS padrão

A maioria dos navegadores usará os seguintes valores padrão para exibir <caption> Elemento:

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

Experimente você mesmo

Suporte ao navegador

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Suporte Suporte Suporte Suporte Suporte