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

Quando usar "id" e quando usar "class"?

Nessa aula, quando definimos o título "Barbearia Alura" como h1, por que utilizamos "class" para identificar esse elemento ao invés de "id", como havíamos feito no parágrafo da missão?

Minha dúvida se expande além deste exemplo também. Há outros casos em que eu teria pensado em usar "id" ao invés de "class", qual a real diferença na aplicação desses dois identificadores?

2 respostas
solução!

As classes são utiliizadas para identificar um grupo de elementos, ou seja, mais de um. Exemplo:

CSS

.classe {
    background: blue;
}

HTML

<!DOCTYPE html>
<html lang="pt-br">
  <head>
    <title>Classe</title>
    <meta charset="utf-8">
  </head>
  <body>
    <div class="classe">Elemento 1</div>
    <div class="classe">Elemento 2</div>
    <div class="classe">Elemento 3</div>
  </body>
</html>

Enquanto o id é utilizado para identificar um único elemento. Sendo assim, não pode repetir eles. Exemplo:

CSS

#id1 {
    background: blue;
}

#id2 {
    background: red;
}

#id3 {
    background: green;
}

HTML

<!DOCTYPE html>
<html lang="pt-br">
  <head>
    <title>Id</title>
    <meta charset="utf-8">
  </head>
  <body>
    <div id="id1">Elemento 1</div>
    <div id="id2">Elemento 2</div>
    <div id="id3">Elemento 3</div>
  </body>
</html>

Sempre que você precisar aplicar 1 estilo para muitos elementos, utiliza-se a classe. Caso você queira mudar somente um único elemento e somente ele, utiliza-se o id.

Espero ter colaborado com a sua dúvida! Abraço e bons estudos!

Obrigado Livia! Além da sua explicação, com a prática fui entendendo melhor. Agora já estou bem familiarizado com a utilização dessas duas tags!

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