Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

[Dúvida] Diferença ente CLASS e ID , e o uso do DIV #HTML5 #CSS3

Gente, estou com umas dúvidas sobre quando devo usar a tag class e a tag id, qual a diferença entre elas ? E outra coisa, se o HTML já naturalmente as divisões de head, header,body,quando é que devo usar o div?

2 respostas
solução!

Oi! Tudo bem?

A tag class é utilizada para realizar uma especificação em que você pode repetir a tag. Por exemplo, caso você queira criar uma classe de botões no seu documento HTML, você pode repetir a mesma com a tag class.

Já a tag id é utilizada para também para realizar uma especificação, e por boas práticas, não é aconselhável repetir.

Vou citar um exemplo do artigo que temos aqui na Alura sobre essa exata dúvida (e deixarei o link abaixo :).

<button id="botao_adicionar" class="botao_cardapio">Adicionar</button>
<button id="botao_filtro" class="botao_cardapio">Filtrar</button>

Imagem mostrando dois botões azuis, um com a palavra de fonte branca "Adicionar" e outra com a palavra de fronte branca "Filtrar".

Acima nós temos o código em que mostra dois botões, que foram divididos em uma só classe: a botao_cardapio, pois são dois botões e fazem parte de um cardápio. Contudo, as ids foram diferentes, uma é a botao_adicionar, para identificar o botão "Adicionar" e outra é a botao_filtro, para identificar o botão "Filtrar".

O artigo que comentei sobre ambas as tags:

E a tag <div> é de uso semântico. Ela foca em dividir as partes do seu código para facilitar a compreensão e, claro, a organização, para ter um código mais limpo. Ou seja: ela é para agrupar os elementos do HTML.

Aqui na Alura também temos uma série de artigos sobre as tags do HTML. Caso te interessar a leitura, irei deixar abaixo o link:

Espero ter ajudado. Se as dúvidas persistirem, estou disponível para te auxiliar.

Caso este post tenha lhe ajudado, por favor, marcar como solucionado ✓.

Salvou, estava procurando esse artigo.

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software