No HTML, existem tanto tags em pares quanto tags únicas (também conhecidas como tags autossuficientes ou elementos vazios). Cada tipo possui um propósito específico e desempenha uma função distinta.

Tags em Pares

Tags em pares consistem em uma tag de abertura e uma de fechamento. Elas podem envolver o conteúdo e agrupar itens para alterar algumas propriedades ou reunir elementos por significado.

Sintaxe:

html

Veja um exemplo real de uso de tags em pares:

Neste exemplo:

• <section>...</section>: agrupa conteúdos relacionados;

• <h1>...</h1>: adiciona um título para a seção;

• <p>...</p>: contém um parágrafo explicando que a maioria das tags HTML são usadas em pares.

Tags Simples

Tags simples consistem apenas em uma tag de abertura, sem tag de fechamento. São utilizadas quando a tag não requer conteúdo ou quando todo o conteúdo e comportamento são definidos por meio de atributos.

Sintaxe:

html

Aqui está um exemplo real de uso de tags simples:

Este código inclui dois elementos:

• <input />: cria um campo de entrada de texto. O atributo placeholder=" name" exibe uma dica dentro da caixa;

• <img />: exibe uma imagem de frutas.

  • alt="Fruits": texto exibido caso a imagem não seja carregada;

  • width e height: definem as dimensões da imagem;

  • src: especifica a URL da imagem.

Aninhamento de Tags

Ao aninhar tags, seguir a ordem hierárquica é essencial, semelhante a bonecas russas. Cada tag aninhada deve ser devidamente incluída dentro de sua tag pai, respeitando as regras da sintaxe HTML.

Veja um exemplo de tags aninhadas:

html

Considere o próximo exemplo válido:

Este código exibe um parágrafo com um link e texto em destaque:

• <p>...</p>: envolve todo o parágrafo;

• <a href="https://privacy.com">...</a>: cria um link clicável para a Política de Privacidade;

• <strong>...</strong>: deixa a palavra "website" em negrito para destacá-la.

Resumindo

HTML é composto por tags pareadas e simples, cada uma com finalidades diferentes. Tags pareadas possuem uma tag de abertura e uma de fechamento para envolver o conteúdo, enquanto tags simples são autocontidas. Aninhar corretamente as tags e seguir a hierarquia adequada são essenciais para uma estrutura HTML bem formada.