Adicionando Legendas
Parte da seção Fundamentals do Journey de HTML da Coddy — lição 49 de 60.
Em tabelas HTML, uma legenda é um título ou explicação para a tabela. Ela fornece uma breve descrição do conteúdo da tabela, tornando mais fácil para os usuários entenderem o propósito da tabela. As legendas são criadas usando a tag <caption>, que deve ser colocada imediatamente após a tag <table>.
Aqui está a sintaxe básica para adicionar uma legenda a uma tabela em HTML:
<table>
<caption>Table Caption</caption>
<tr>
<th>Header 1</th>
<th>Header 2</th>
</tr>
<tr>
<td>Row 1, Cell 1</td>
<td>Row 1, Cell 2</td>
</tr>
</table>
Desafio
FácilCrie um documento HTML que inclua uma tabela com uma legenda. A tabela deve ter a seguinte estrutura:
- Uma tag
<table>para definir a tabela. - Uma tag
<caption>com o texto "Product Inventory" para descrever a tabela. - Uma linha da tabela (
<tr>) para o cabeçalho com duas células de cabeçalho (<th>). As células de cabeçalho devem dizer "Product Name" e "Quantity". - Uma linha da tabela (
<tr>) com duas células de dados (<td>). As células devem dizer "Laptop" e "5". - Outra linha da tabela (
<tr>) com duas células de dados (<td>). As células devem dizer "Mouse" e "10".
Folha de consulta
A tag <caption> fornece um título ou explicação para uma tabela HTML. Ela deve ser colocada imediatamente após a tag <table>.
<table>
<caption>Table Caption</caption>
<tr>
<th>Header 1</th>
<th>Header 2</th>
</tr>
<tr>
<td>Row 1, Cell 1</td>
<td>Row 1, Cell 2</td>
</tr>
</table>Experimente você mesmo
<!DOCTYPE html>
<html>
<body>
<!-- Escreva o código aqui -->
</body>
</html>
Teste seus conhecimentosEsta lição inclui um quiz rápido. Comece a lição para respondê-lo e acompanhar seu progresso.
Todas as lições de Fundamentals
1Fundamentos do HTML
O que é HTML?Estrutura Básica do HTMLTags e ElementosAninhamento e Fechamento de TagsComentários em HTML7Página de Perfil Pessoal
Visão Geral do ProjetoSeção de Cabeçalho
Foto de PerfilSeção Sobre MimLinks Sociais10Tabelas
Fundamentos de TabelasAdicionando LegendasMesclando Linhas e ColunasRecapitulação - Tabelas2Texto e Formatação
TítulosParágrafosQuebras de LinhaTexto em Negrito e ItálicoNegrito e Itálico NovamenteRecapitulação - Formatação8Formulários e Inputs Parte 1
Fundamentos de FormuláriosInputs de TextoAtributos de InputCampo de SenhaLabels para InputsRecapitulação - Formulário Básico11Página de Inscrição de Evento
Visão Geral do ProjetoSeção de CabeçalhoSeção de Detalhes do EventoFormulário de InscriçãoSeção de Rodapé