RUNWEBTOOLS
Português

Referência de tags HTML

Os elementos HTML que você mais usará, agrupados por finalidade. Prefira tags semânticas (como <nav> e <article>) a <div> genéricos quando puder — elas melhoram a acessibilidade e o SEO. Para organizar a marcação, use o formatador de HTML.

Atualizado 2026-07-06

Estrutura do documento

TagPara que serve
<html>Raiz do documento
<head>Metadados: title, link, script (não exibidos na página)
<body>O conteúdo visível da página
<title>Título da página (aba do navegador, resultados de busca)
<meta>Metadados como charset, viewport e description
<link>Link para um recurso externo, normalmente uma folha de estilo
<script>Incorporar ou referenciar JavaScript
<style>Incorporar CSS na página

Texto

TagPara que serve
<h1>–<h6>Títulos, do mais ao menos importante
<p>Um parágrafo de texto
<a>Um hyperlink (usa href)
<span>Contêiner inline sem significado próprio
<strong>Texto importante (negrito por padrão)
<em>Texto enfatizado (itálico por padrão)
<br>Uma quebra de linha
<hr>Uma quebra temática (régua horizontal)
<blockquote>Uma citação em bloco
<code>Código inline
<pre>Texto pré-formatado (mantém os espaços)

Listas

TagPara que serve
<ul>Lista não ordenada (com marcadores)
<ol>Lista ordenada (numerada)
<li>Um item de lista
<dl>Lista de descrição (pares termo/definição)

Links e mídia

TagPara que serve
<img>Uma imagem (usa src e alt)
<video>Vídeo incorporado
<audio>Áudio incorporado
<svg>Gráficos vetoriais inline
<picture>Imagens responsivas com múltiplas fontes
<iframe>Incorporar outra página dentro desta

Formulários

TagPara que serve
<form>Um formulário que coleta e envia entradas
<input>Uma entrada de uma linha (texto, caixa, rádio, etc.)
<textarea>Uma entrada de texto multilinha
<button>Um botão clicável
<select>Uma lista suspensa
<option>Um item dentro de um <select>
<label>Um rótulo para um controle de formulário (melhora a acessibilidade)

Tabelas

TagPara que serve
<table>Uma tabela de dados
<tr>Uma linha da tabela
<td>Uma célula da tabela
<th>Uma célula de cabeçalho
<thead>Agrupa as linhas de cabeçalho
<tbody>Agrupa as linhas do corpo

Seccionamento semântico

TagPara que serve
<header>Conteúdo introdutório para uma página ou seção
<nav>Um bloco de links de navegação
<main>O conteúdo principal da página (um por página)
<section>Um agrupamento temático de conteúdo
<article>Conteúdo autônomo (um post, um card)
<aside>Conteúdo tangencial (uma barra lateral)
<footer>Rodapé para uma página ou seção
<figure>Mídia autônoma com uma legenda opcional

Ferramentas relacionadas