Tag HTML <caption>


Exemplo

Uma tabela com uma legenda:

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

Mais exemplos de "Experimente você mesmo" abaixo.


Definição e uso

A <caption>tag define uma legenda de tabela.

A <caption>tag deve ser inserida imediatamente após a tag <table> .

Dica: Por padrão, uma legenda de tabela será alinhada ao centro acima de uma tabela. No entanto, as propriedades CSS text-align e caption-side podem ser usadas para alinhar e colocar a legenda.


Suporte ao navegador

Element
<caption> Yes Yes Yes Yes Yes

Atributos Globais

A <caption>tag também suporta os Atributos Globais em HTML .


Atributos do evento

A <caption>tag também suporta os atributos de evento em HTML .



Mais exemplos

Exemplo

Posicione as legendas da tabela (com 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>

Páginas relacionadas

Referência HTML DOM: objeto de legenda


Configurações padrão de CSS

A maioria dos navegadores exibirá o <caption>elemento com os seguintes valores padrão:

Exemplo

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