Exemplo
Uma tabela HTML simples com duas células de cabeçalho e duas células de dados:
<table>
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
</tr>
</table>
Tente você mesmo " Mais "Tente você mesmo" exemplos abaixo.
Definição e Uso
O <th> tag define uma célula de cabeçalho em uma tabela HTML.
Uma tabela HTML tem dois tipos de células:
- As células de cabeçalho - contém informações de cabeçalho (criado com o <th> elemento)
- Células normais - contém dados (criado com o <td> elemento)
O texto em <th> elementos são negrito e centralizado por padrão.
O texto em <td> elementos são regulares e alinhado à esquerda por padrão.
Suporte a navegadores
| Elemento | |||||
|---|---|---|---|---|---|
| <th> | sim | sim | sim | sim | sim |
Dicas e Notas
Dica: Use o colspan e rowspan atributo para permitir que o tempo de conteúdo através de múltiplas colunas ou linhas!
Diferenças entre HTML 4.01 e HTML5
Todos os atributos de layout são removidos em HTML5.
Atributos
| Atributo | Valor | Descrição |
|---|---|---|
| abbr | text | Especifica uma versão abreviada do conteúdo de uma célula de cabeçalho |
| align | left right center justify char | Não suportado em HTML5. Alinha o conteúdo de uma célula de cabeçalho |
| axis | category_name | Não suportado em HTML5. Categoriza as células de cabeçalho |
| bgcolor | rgb(x,x,x) #xxxxxx colorname | Não suportado em HTML5. Especifica a cor de uma célula de cabeçalho de fundo |
| char | character | Não suportado em HTML5. Alinha o conteúdo de uma célula de cabeçalho de um personagem |
| charoff | number | Não suportado em HTML5. Define o número de caracteres o conteúdo será alinhado do caractere especificado pelo char atributo |
| colspan | number | Especifica o número de colunas de uma célula de cabeçalho deve abrangem |
| headers | header_id | Especifica uma ou mais células de cabeçalho de uma célula está relacionada com |
| height | pixels % | Não suportado em HTML5. Define a altura de uma célula de cabeçalho |
| nowrap | nowrap | Não suportado em HTML5. Especifica que o conteúdo dentro de uma célula de cabeçalho não deve quebrar |
| rowspan | number | Especifica o número de linhas que uma célula de cabeçalho deve abrangem |
| scope | col colgroup row rowgroup | Especifica se uma célula de cabeçalho é um cabeçalho para uma coluna, linha ou grupo de colunas ou linhas |
| sorted | reversed number reversed number number reversed | Define a direção de classificação de uma coluna |
| valign | top middle bottom baseline | Não suportado em HTML5. Vertical alinha o conteúdo de uma célula de cabeçalho |
| width | pixels % | Não suportado em HTML5. Especifica a largura de uma célula de cabeçalho |
Atributos globais
O <th> tag também suporta o Global de Atributos em HTML .
Atributos de eventos
O <th> tag também suporta o evento Atributos em HTML .
Tente você mesmo - Exemplos
cabeçalhos da tabela
Como criar cabeçalhos da tabela.
Tabela com uma legenda
Uma tabela HTML com uma legenda.
Marcações dentro de uma tabela
Como exibir elementos dentro de outros elementos.
C ells que se estendem por mais de uma linha / coluna
Como definir células da tabela que se estendem por mais de uma linha ou uma coluna.
Páginas relacionadas
Tutorial HTML: tabelas HTML
Referência HTML DOM: TableHeader Objeto
CSS Tutorial: Tabelas Styling
Configurações CSS padrão
A maioria dos navegadores irá exibir o <th> elemento com os seguintes valores padrão:
th {
display: table-cell;
vertical-align: inherit;
font-weight: bold;
text-align: center;
}