CodeGym /Cursos /Frontend SELF PT /Caracteres especiais

Caracteres especiais

Frontend SELF PT
Nível 4 , Lição 5
Disponível

5.1 Escape de caracteres

No HTML, caracteres especiais, também conhecidos como "character entities", são usados para representar caracteres que, de outra forma, seriam interpretados como parte da sintaxe HTML. Esses caracteres incluem, por exemplo, os colchetes angulares, o ampersand, espaços, assim como caracteres de diversos idiomas e conjuntos de caracteres.

Colchetes angulares e ampersand

Para exibir caracteres que são usados em HTML como parte de uma tag ou sintaxe, é necessário usar códigos especiais:

  • < : &lt;
  • > : &gt;
  • & : &amp;

Exemplo de uso:

HTML
    
      <p>Use &lt; e &gt; para indicar colchetes angulares e &amp; para o ampersand.</p>
    
  

Aspas

Para exibir aspas duplas e simples dentro de atributos HTML:

  • " : &quot;
  • ' : &apos;

Exemplo de uso:

HTML
    
      <p>Para aspas use &quot;duplas&quot; e &apos;simples&apos;.</p>
    
  

5.2 Espaços e espaços inseparáveis

No HTML múltiplos espaços seguidos sempre são exibidos como um único espaço. Para preservar espaços ou criar espaços inseparáveis, usam-se caracteres especiais:

  • Espaço : &nbsp;
  • Espaço fino : &thinsp;
  • Espaço em : &emsp;
  • Meio espaço : &ensp;

Exemplo de uso:

HTML
    
      <p>Este&nbsp;texto&nbsp;contém&nbsp;vários&nbsp;espaços&nbsp;inseparáveis.</p>
    
  

Caracteres especiais e diacríticos

O HTML oferece suporte a muitos caracteres especiais para várias linguagens e conjuntos de caracteres. Por exemplo:

  • © : &copy;
  • ® : &reg;
  • ™ : &trade;
  • € : &euro;
  • £ : &pound;

Exemplo de uso:

HTML
    
      <p>Direitos autorais &copy; 2024. Todos os direitos reservados. Preço: 50 &euro;</p>
    
  

Caracteres matemáticos

HTML suporta uma ampla gama de caracteres matemáticos:

  • ± : &plusmn;
  • × : &times;
  • ÷: &divide;
  • ≤ : &le;
  • ≥: &ge;
  • ∞ : &infin;
  • √ : &radic;

Exemplo de uso:

HTML
    
      <p>Solução da equação: x &ge; 5 e x &le; 10. Use &radic; para indicar raiz.</p>
    
  

5.3 Setas e outros símbolos gráficos

HTML também suporta setas e outros símbolos gráficos:

  • ← : &larr;
  • ↑ : &uarr;
  • → : &rarr;
  • ↓ : &darr;
  • ↔ : &harr;
  • ♠ : &spades;
  • ♣ : &clubs;
  • ♥ : &hearts;
  • ♦ : &diams;

Exemplo de uso:

HTML
    
      <p>Direções: &larr; esquerda, &uarr; cima, &rarr; direita, &darr; baixo.</p>
      <p>Naipes de cartas: &spades; &hearts; &diams; &clubs;</p>
    
  

Lista completa de caracteres especiais

Uma lista completa de caracteres especiais pode ser encontrada na documentação HTML ou em recursos especializados na web, como o W3Schools ou a Referência de Character Entities HTML.

5.4 Uso de emojis

Os emojis se tornaram parte integrante da comunicação digital moderna. Eles são usados para expressar emoções, ideias e objetos em mensagens de texto, redes sociais e páginas da web. No HTML, emojis podem ser utilizados de várias maneiras.

Uso de Unicode

Emojis podem ser inseridos em um documento HTML usando símbolos Unicode. Cada emoji tem um código único que pode ser usado para sua exibição.

Exemplo de uso de Unicode:

HTML
    
      <p>Carinha sorridente: 😀</p>
      <p>Coração: ❤️</p>
      <p>Polegar para cima: 👍</p>

    
  

Para inserir emojis usando Unicode, basta usar seu código hexadecimal, precedido por &#x e terminado com ;.

Exemplo de uso de códigos hexadecimais:

HTML
    
      <p>Carinha sorridente: &#x1F600;</p>
      <p>Coração: &#x2764;&#xFE0F;</p>
      <p>Polegar para cima: &#x1F44D;</p>

    
  

Não precisa decorar isso: basta dar uma pesquisada rápida se precisar, e não se assuste se encontrar no código de alguém 😊

1
Опрос
Tags principais do HTML,  4 уровень,  5 лекция
недоступен
Tags principais do HTML
Tags principais do HTML
Comentários
TO VIEW ALL COMMENTS OR TO MAKE A COMMENT,
GO TO FULL VERSION