HTML: Entidades de Caracteres HTML

Em HTML, certos caracteres (como <, >, &) são usados como parte da sintaxe das tags. Se você quiser exibir esses caracteres na página, precisará usar entidades de caracteres — também chamadas de caracteres de escape.

1. Por Que Entidades São Necessárias

Quando o navegador encontra <, ele o interpreta como o início de uma tag. Para exibi-lo como um sinal de "menor que" na página, você deve escrever <. Da mesma forma, o próprio símbolo & precisa ser escapado, pois é o prefixo das referências de entidade.

(1) Tabela de Referência

▶ Exemplo

<p>Em HTML, use &lt; para menor que, e &gt; para maior que.</p>
<p>&amp; é o próprio símbolo "e comercial".</p>
<p>Resultado: use < para menor que, > para maior que. & é o próprio símbolo "e comercial".</p>

2. Tabela de Entidades Mais Usadas

Aqui estão as entidades de caracteres mais usadas em HTML — vale a pena memorizar:

▶ Exemplo

<!-- Entidades HTML comuns -->
<p>Espaço sem quebra: &nbsp;</p>
<p>Menor que: &lt;</p>
<p>Maior que: &gt;</p>
<p>E comercial: &amp;</p>
<p>Aspas duplas: &quot;</p>
<p>Aspas simples: &apos;</p>
<p>Símbolo de direitos autorais: &copy;</p>
<p>Marca registrada: &reg;</p>
<p>Marca comercial: &trade;</p>
<p>Símbolo do euro: &euro;</p>
<p>Símbolo do iene/yuan: &yen;</p>
<p>Símbolo da libra: &pound;</p>

3. Referências Numéricas e Entidades Nomeadas

Os símbolos de entidade vêm em duas formas: entidades nomeadas (por exemplo, ©) e referências numéricas (por exemplo, ©). As referências numéricas podem usar decimal ou hexadecimal (com o prefixo x):

▶ Exemplo

<p>Entidade nomeada: &copy; 2026 Web-Tutorial</p>
<p>Referência decimal: &#169; 2026 Web-Tutorial</p>
<p>Referência hexadecimal: &#x00A9; 2026 Web-Tutorial</p>
<p>As três produzem exatamente o mesmo resultado: todas exibem o símbolo ©.</p>

4. Caracteres de Espaço em Branco Especiais

O HTML converte vários espaços consecutivos em um único espaço por padrão. Se você precisar preservar um espaçamento específico, use estas abordagens:

▶ Exemplo

<p>Normal: Múltiplos   espaços   são convertidos.</p>
<p>Espaços com entidade: Múltiplos&nbsp;&nbsp;&nbsp;espaços&nbsp;&nbsp;são preservados.</p>
<p>Nota: &nbsp; também é usado para evitar quebra de linha por hifenização, ex.: "100&nbsp;km/h" não será quebrado entre linhas.</p>

5. Resumo dos Cenários de Uso

• Exibição de código: Ao mostrar tags como <div> em exemplos de código, você deve usar < e >
• Símbolos especiais: Direitos autorais ©, marca registrada ®, símbolos de moeda
• Evitar quebras de linha: Use   para manter expressões como "100 km/h" ou "Capítulo 1" sem quebrar entre linhas
• Aninhamento de aspas: Ao usar aspas dentro de valores de atributos, as aspas internas precisam ser escapadas

❓ Perguntas Frequentes

📖 Resumo

• Entidades começam com & e terminam com ;
• Entidades comuns: <, >, &,  , ©
• Entidades vêm em duas formas: entidades nomeadas e referências numéricas
• Espaços consecutivos são convertidos pelo navegador; use   para forçar a preservação

📝 Exercícios

1. Exibição de código: Crie um parágrafo que exiba o texto "Use <h1> até <h6> para definir títulos" na página, onde <h1> até <h6> devem aparecer em formatação de estilo de código azul.
2. Aviso de direitos autorais: Escreva um aviso de direitos autorais no rodapé da página usando © para o símbolo de copyright e   para manter o espaçamento adequado.
3. Combinação de entidades: Escreva uma linha de texto usando entidades que inclua um sinal de menor que, maior que, e comercial e aspas ao mesmo tempo.

Equipe Técnica Web-Tutorial

Uma plataforma de tutoriais mantida por diversos desenvolvedores. Cada tutorial é escrito e revisado por profissionais da área correspondente. Trabalhamos para manter nosso conteúdo preciso e confiável — se encontrar algum problema, avise-nos.

Sobre Nós