Minicursos - HTML

O que são Tags?


Eu citei na apresentação da linguagem HTML o termo “tag”, mas se você é iniciante e está dando seus primeiros passos em busca de aprender a criar páginas para a Internet, talvez não saiba muito bem o que é isso. Vamos começar por essa pergunta...

Afinal, o que são tags?

Bem, tags nada mais são do que rótulos ou cápsulas que abrigam conteúdos. Cada tag tem uma função específica e vamos falar um pouco sobre as mais importantes. Vejam como é simples:

A tag p refere-se a um parágrafo, a tag table a uma tabela, a form a um formulário, e assim por diante. Podemos pensar na tag como sendo um identificador do objeto que se quer criar na tela.

Uma tag é composta por sinais de maior e menor, que abrigam o identificador da mesma, por exemplo:

<p> - Tag de início de parágrafo
<table> - Tag de início de tabela
<i> - Tag de início de texto em itálico

A maioria das tags necessita de um par, para que o navegador saiba onde termina a instrução. Vou explicar com um exemplo que facilitará a compreensão.

Imaginem o seguinte parágrafo:

640 Kb são mais do que suficientes para qualquer um. * Bill Gates, 1981

Se quisermos criar um parágrafo HTML para ser exibido em navegadores com essa mesma frase, ele deveria ser feito assim:

<p>640 Kb são mais do que suficientes para qualquer um. * Bill Gates, 1981</p>

Na tela do navegador isso seria exibido assim:



Percebam que iniciei o parágrafo com uma tag<p>,depois inseri o conteúdo do mesmo e, por fim, encerrei esse parágrafo com a tag </p>.O encerramento das tags sempre se dá dessa forma, com uma barra antes do elemento identificador e, sempre os abrangendo com os sinais de menor e maior. Vale lembrar que tags podem estar aninhadas, ou seja, umas dentro das outras. Outro exemplo deixará isso claro.

Se quiséssemos utilizar a mesma frase acima, mas deixar o nome do autor em itálico, faríamos assim:

<p>640 Kb são mais do que suficiente para qualquer um. *<i>Bill Gates</i>,1981</p>

Vejam agora que eu envolvi o nome Bill Gates usando as tags <i> e </i>. A exibição disso em um navegador seria:



O importante a ressaltar é que as tags devem ser fechadas em ordem inversa à sua criação. A última aberta deve ser a primeira a ser fechada, conforme o último exemplo. Seria INCORRETO fazer assim:

<p>640 Kb são mais do que suficiente para qualquer um. *<i>Bill Gates, 1981</p></i>

Acima eu fechei o parágrafo antes de fechar a tag <i>. Em alguns casos os navegadores modernos ignorarão isso e a exibição será perfeita, mas esse recurso de auto correção de erros por parte dos navegadores não deve ser usado.

No exemplo acima nem daria certo, pois queremos apenas o nome do autor em itálico e, dessa forma incorreta, o ano em que a frase foi dita também ficaria em itálico. Mas repito, existem situações em que isso não fará diferença, mas é uma boa prática de estruturação sempre fechar primeiro a última tag aberta. Isso organiza seu código e facilita futuras manutenções.

Na sequência veremos algumas das principais tags HTML.



Notícias - Games

Atari VCS é finalmente lançado e surpreende

O Atari VCS foi lançado recentemente e trouxe suporte a praticamente todos os serviços de streaming de jogos já disponíveis. A única exceção foi por conta do Playstation Now, cujo suporte nativo não é oferecido, mas ele pode ser acessado através do modo PC do VCS, já que o console possui Googl...

Ler Notícia Completa

The King of Fighters XV já tem data para chegar

A SNK finalmente definiu uma data para lançamento do tão esperando The King Of Fighters XV. Segundo comunicado recente, o game de luta deve chegar em 17 de fevereiro de 2022 para os consoles Playstation 4, Playstation 5, Xbox Series X e S, além de PCs. O título contará com 39 personagens e mante...

Ler Notícia Completa
Ajude o Contém Bits com um cafezinho!

Se você gostou do artigo, se ele lhe foi útil de alguma maneira e você quiser ajudar o Contém Bits, saiba que é simples, fácil e rápido. Basta clicar na imagem do PayPal (ou no cafezinho) e seguir as instruções, em ambiente seguro e com o respaldo do Paypal. Eu agradeço muito! :)


Você gostará destes vídeos!