Referência de Tags HTML
Referência alfabética de todas as tags HTML — 112 elementos com descrições rápidas.HTML5 marca novas tags no HTML5, Descontinuado marca tags removidas ou desencorajadas, Obsoleto marca tags obsoletas.
| Tag | Descrição |
|---|---|
! — Especial | |
| <!--...--> | Define um comentário HTML. O conteúdo dentro é ocultado do navegador. |
| <!DOCTYPE> | Declara o tipo de documento. Diz ao navegador para renderizar no modo de padrão. |
A | |
| <a> | Cria um hyperlink para outra página, arquivo, endereço de e-mail ou local dentro da mesma página. |
| <abbr> | Marca uma abreviação ou acrônimo. O atributo title expande o termo completo ao passar o mouse. |
| <acronym> Descontinuado | Definia um acrônimo. Não suportado no HTML5 — use <abbr> em vez disso. |
| <address> | Fornece informações de contato para o autor ou proprietário da página ou artigo. Tipicamente renderizado em itálico. |
| <area> | Define uma região clicável dentro de um mapa de imagem. Funciona com <map> para criar hotspots interativos. |
| <article> HTML5 | Representa um conteúdo independente que pode ser distribuído separadamente — post de blog, notícia, thread de fórum. |
| <aside> HTML5 | Define conteúdo tangencialmente relacionado ao conteúdo principal — barras laterais, caixas de destaque, citações. |
| <audio> HTML5 | Incorpora conteúdo de som. Suporta formatos MP3, WAV e OGG com fallback via <source>. |
B | |
| <b> | Chama atenção para o texto sem transmitir importância extra. Renderizado como negrito por padrão. |
| <base> | Define a URL base para todos os links relativos no documento. Apenas um <base> por página. |
| <bdi> HTML5 | Isola um trecho de texto que pode ser formatado em uma direção de escrita diferente. Previne confusão de texto bidirecional. |
| <bdo> | Sobrescreve a direção atual do texto. Use dir="rtl" ou dir="ltr" para controlar a renderização. |
| <blockquote> | Representa uma citação longa retirada de outra fonte. Navegadores tipicamente a recuam. |
| <body> | Contém o conteúdo visível do documento HTML — texto, imagens, tabelas, formulários e tudo que o usuário vê. |
| <br> | Insere uma quebra de linha. Use para quebras curtas inline como endereços ou poemas, não para espaçamento. |
| <button> | Cria um botão clicável. Pode enviar formulários, limpar campos ou acionar JavaScript. |
C | |
| <canvas> HTML5 | Fornece uma região desenhável controlada por JavaScript. Usado para gráficos, animações e renderização de jogos. |
| <caption> | Adiciona um título visível a uma tabela. Sempre aparece imediatamente após a tag de abertura <table>. |
| <cite> | Marca o título de uma obra criativa — livro, artigo, música, filme. Renderizado em itálico por padrão. |
| <code> | Exibe um fragmento de código de computador. Navegadores o renderizam em fonte monospace. |
| <col> | Define propriedades de coluna dentro de um <colgroup>. Útil para aplicar larguras ou estilos consistentes a colunas inteiras. |
| <colgroup> | Agrupa um ou mais elementos <col> para aplicar formatação através das colunas da tabela. |
D | |
| <data> HTML5 | Vincula um conteúdo a um valor legível por máquina através do atributo value. |
| <datalist> HTML5 | Fornece um conjunto de opções predefinidas para um campo <input>, habilitando sugestões de autocompletar conforme o usuário digita. |
| <dd> | Fornece a descrição ou valor para um termo em uma lista de definição (<dl>). |
| <del> | Representa texto que foi removido do documento. Navegadores o renderizam com tachado. |
| <details> HTML5 | Cria um widget de divulgação interativo que usuários podem expandir ou recolher para revelar conteúdo adicional. |
| <dfn> | Marca a instância definição de um termo. O termo em si é tipicamente renderizado em itálico. |
| <dialog> HTML5 | Representa uma caixa de diálogo ou janela popup interativa. Pode ser mostrada modalmente com JavaScript. |
| <div> | O container genérico de nível bloco. Usado para layout e agrupamento quando nenhum elemento semântico se encaixa. |
| <dl> | Cria uma lista de definição — uma lista de pares termo-descrição usando <dt> e <dd>. |
| <dt> | Define um termo ou nome em uma lista de definição (<dl>). |
E | |
| <em> | Indica ênfase. O conteúdo é tipicamente renderizado em itálico — pense nisso como estresse verbal em uma frase. |
| <embed> HTML5 | Incorpora conteúdo externo como PDFs, plugins do navegador ou mídia interativa diretamente na página. |
F | |
| <fieldset> | Agrupa controles de formulário relacionados, desenhando uma borda ao redor deles para clareza visual. |
| <figcaption> HTML5 | Fornece uma legenda ou descrição para o conteúdo dentro de um elemento <figure>. |
| <figure> HTML5 | Envolve mídia independente — imagens, diagramas, trechos de código, gráficos — frequentemente combinado com <figcaption>. |
| <footer> HTML5 | Define o rodapé de uma página ou seção — tipicamente contém informações de copyright, links e detalhes de autoria. |
| <form> | Cria um formulário interativo que coleta entrada do usuário e a envia para um servidor para processamento. |
| <frame> Removido | Um antigo elemento de frame HTML4. Removido no HTML5 — use <iframe> em vez disso. |
| <frameset> Removido | Um antigo container de frameset HTML4. Removido no HTML5 — use <iframe> em vez disso. |
H | |
| <h1> - <h6> | Elementos de título do nível 1 (mais importante) ao nível 6 (menos importante). Usados para estruturar o conteúdo da página hierarquicamente. |
| <head> | Contém metadados sobre a página — título, conjunto de caracteres, estilos, scripts e outras informações não exibidas diretamente. |
| <header> HTML5 | Representa conteúdo introdutório — links de navegação, logotipos, títulos. Pode ser usado por página ou por seção. |
| <hgroup> HTML5 | Agrupa um conjunto de títulos (<h1>—<h6>) para tratá-los como um único título com subtítulo. |
| <hr> | Desenha uma linha horizontal — um separador visível entre seções temáticas de conteúdo. |
| <html> | O elemento raiz de um documento HTML. Todos os outros elementos são descendentes desta tag. |
I | |
| <i> | Denota texto em uma voz alternativa — termos técnicos, frases estrangeiras, pensamentos. Renderizado em itálico. |
| <iframe> | Incorpora outro documento HTML inline. Usado para vídeos, mapas, anúncios e conteúdo externo. |
| <img> | Incorpora uma imagem. Requer src (caminho do arquivo) e alt (descrição acessível). |
| <input> | O controle de formulário mais versátil — suporta mais de 20 tipos incluindo texto, senha, data, arquivo, checkbox e radio. |
| <ins> | Marca texto que foi inserido no documento. Navegadores o renderizam com sublinhado. |
K | |
| <kbd> | Representa entrada de teclado — teclas que o usuário deve pressionar. Frequentemente renderizado em fonte monospace. |
L | |
| <label> | Define um rótulo para um controle de formulário. Clicar no rótulo foca ou ativa o input associado. |
| <legend> | Fornece uma legenda para um grupo <fieldset>, descrevendo o propósito dos controles agrupados. |
| <li> | Representa um único item em uma lista ordenada (<ol>) ou não ordenada (<ul>). |
| <link> | Vincula recursos externos — mais comumente folhas de estilo. Colocado dentro do <head>. Também usado para favicons e preloading. |
M | |
| <main> HTML5 | Identifica o conteúdo dominante da página. Deve haver apenas um <main> por documento. |
| <map> | Define um mapa de imagem do lado do cliente — uma forma de tornar partes de uma imagem clicáveis usando tags <area>. |
| <mark> HTML5 | Destaca texto para referência ou notação — como uma caneta marca-texto em uma página impressa. |
| <menu> HTML5 | Representa um conjunto de comandos ou um menu de barra de ferramentas. Pode substituir <ul> para listas de menu semânticas. |
| <meta> | Define metadados sobre o documento — codificação de caracteres, descrição, configurações de viewport e mais. |
| <meter> HTML5 | Exibe uma medição escalar dentro de um intervalo conhecido — uso de disco, consumo de memória, pontuação de avaliação. |
N | |
| <nav> HTML5 | Define um bloco de links de navegação — menus principais, sumário, breadcrumbs. |
| <noscript> | Fornece conteúdo fallback exibido quando JavaScript está desabilitado ou não suportado no navegador. |
O | |
| <object> | Incorpora recursos externos — PDFs, Flash (legado) ou outros plugins. Alternativa declarativa ao <embed>. |
| <ol> | Cria uma lista ordenada (numerada). Cada item é envolvido em <li>. |
| <optgroup> | Agrupa elementos <option> relacionados dentro de um dropdown <select> com um rótulo visível. |
| <option> | Representa uma única escolha dentro de um <select>, <datalist> ou <optgroup>. |
| <output> HTML5 | Exibe o resultado de um cálculo ou ação do usuário — perfeito para feedback de formulário ao vivo. |
P | |
| <p> | Define um parágrafo de texto. O container de texto de nível bloco mais fundamental em HTML. |
| <param> | Define parâmetros para um elemento <object>. Usado com plugins legados como Flash. |
| <picture> HTML5 | Fornece alternativas responsivas de imagem com base no tamanho da tela, resolução ou suporte de formato via múltiplos elementos <source>. |
| <pre> | Renderiza texto pré-formatado — preserva espaços e quebras de linha. Renderizado em monospace, ideal para blocos de código. |
| <progress> HTML5 | Mostra o progresso de conclusão de uma tarefa — upload de arquivo, etapas de formulário ou qualquer processo em andamento. |
Q | |
| <q> | Marca uma citação curta inline. Navegadores adicionam aspas automaticamente ao redor do conteúdo. |
R | |
| <rp> HTML5 | Fornece parênteses fallback para navegadores que não suportam anotações ruby. |
| <rt> HTML5 | Define o texto de pronúncia ou anotação em uma anotação ruby (usado para tipografia do Leste Asiático). |
| <ruby> HTML5 | Envolve uma anotação ruby — texto guia pequeno acima ou ao lado de caracteres do Leste Asiático para indicar pronúncia. |
S | |
| <s> | Representa conteúdo que não é mais preciso ou relevante. Renderizado com tachado. |
| <samp> | Exibe saída de amostra de um programa de computador. Renderizado em tipo monospace. |
| <script> | Incorpora ou referencia código JavaScript executável. Pode ser colocado inline ou vinculado a um arquivo externo. |
| <section> HTML5 | Define um agrupamento temático de conteúdo — capítulos, painéis de abas ou qualquer seção distinta de uma página. |
| <select> | Cria uma lista de seleção dropdown. Opções são definidas com elementos <option>. |
| <slot> HTML5 | Um placeholder dentro de um Web Component que pode ser preenchido com markup personalizado quando o componente é usado. |
| <small> | Renderiza comentários laterais e texto miúdo — notas de copyright, isenções de responsabilidade, texto legal. Navegadores exibem um tamanho menor. |
| <source> HTML5 | Especifica múltiplos recursos de mídia para <audio>, <video> ou <picture>. O navegador escolhe o primeiro formato compatível. |
| <span> | O container genérico inline. Usado para estilização ou scripting de pequenas porções de texto sem alterar o fluxo do documento. |
| <strong> | Indica forte importância, seriedade ou urgência. Navegadores o renderizam em negrito — mais significativo que <b>. |
| <style> | Contém regras CSS que se aplicam diretamente à página. Pode ser escopo com consultas media. |
| <sub> | Renderiza texto subscrito — rebaixado abaixo da linha de base. Usado em fórmulas químicas (H₂O) e notas de rodapé. |
| <summary> HTML5 | Fornece o cabeçalho visível para um widget de recolhimento <details>. Clicar nele alterna os detalhes aberto ou fechado. |
| <sup> | Renderiza texto sobrescrito — elevado acima da linha de base. Comumente usado para números ordinais (1º) e expoentes matemáticos. |
T | |
| <table> | Cria uma tabela HTML para exibir dados estruturados em linhas e colunas. |
| <tbody> | Agrupa as linhas do corpo de uma tabela. Ajuda com estrutura semântica e estilização direcionada. |
| <td> | Define uma célula de dados padrão em uma tabela. O conteúdo pode ser texto, imagens ou outros elementos HTML. |
| <template> HTML5 | Armazena fragmentos HTML que não são renderizados imediatamente. JavaScript pode cloná-los e inseri-los depois. |
| <textarea> | Cria um controle de entrada de texto de múltiplas linhas. Útil para comentários, mensagens e respostas mais longas de formulário. |
| <tfoot> | Agrupa as linhas de rodapé de uma tabela — tipicamente usado para resumos, totais ou notas de coluna. |
| <th> | Define uma célula de cabeçalho em uma tabela. Renderizado em negrito e centralizado por padrão. Melhora a acessibilidade para leitores de tela. |
| <thead> | Agrupa as linhas de cabeçalho de uma tabela. Combinado com <tbody> e <tfoot> para estrutura semântica de tabela. |
| <time> HTML5 | Marca uma data ou hora específica em um formato legível por máquina. Ajuda mecanismos de busca a exibir snippets de eventos. |
| <title> | Define o título da página exibido na aba do navegador. Também usado como título clicável nos resultados de busca. |
| <tr> | Define uma linha em uma tabela HTML. Contém células <th> ou <td>. |
| <track> HTML5 | Adiciona faixas de texto com temporização (legendas, descrições) a elementos <video> ou <audio>. |
U | |
| <u> | Renderiza texto com sublinhado. Originalmente para links, agora usado para palavras com erro ortográfico ou nomes próprios em chinês/japonês. |
| <ul> | Cria uma lista não ordenada (com marcadores). Cada item é envolvido em <li>. |
V | |
| <var> | Representa um nome de variável em expressões matemáticas ou código de programação. Tipicamente renderizado em itálico. |
| <video> HTML5 | Incorpora conteúdo de vídeo diretamente na página. Suporta MP4, WebM e OGG com fallback via <source>. |
W | |
| <wbr> HTML5 | Sugere um ponto opcional de quebra de linha. Diz ao navegador que é OK quebrar uma palavra longa nessa posição. |