Olá! Surgiu uma dúvida enquanto estava fazendo os cursos mais avançados de Front-end, mas como ela é relacionada a HTML resolvi postar aqui. Quais são os critérios que devo utilizar para escolher entre uma class e uma ID? Agradeço pela atenção.
Você está vendo a versão anterior da nova experiência da Alura que estamos preparando para você. Em breve, ela ganha uma identidade visual novinha totalmente pensada em potencializar seus estudos!
Solucionado
Olá! Surgiu uma dúvida enquanto estava fazendo os cursos mais avançados de Front-end, mas como ela é relacionada a HTML resolvi postar aqui. Quais são os critérios que devo utilizar para escolher entre uma class e uma ID? Agradeço pela atenção.
Oi, Rodrigo, tudo bem?
Então, as classes trabalham de uma forma que identificam um grupo de elementos. Através delas, pode-se atribuir a estilização de vários elementos de uma vez só. E para identifica-la no css, usa-se o ponto (.), antes do nomeVê no exemplo:
<div class="container">
<h1> Seu trabalhos</h1>
</div>
<div class="container">
<h1> Seu texto de apresentação</h1>
</div>
<div class="container">
<h1> Seu currículo</h1>
</div>
.container{
background-color: red;
}Acima vemos que consigmos fazer a mesma edição das três div igualmente com a classe container a partir do código CSS, ou seja, as três tags divs ficarão com o fundo vermelho
Já o ID, é o oposto da Classe, ele só se refere a um elemento. Ela é exclusiva. Não podendo haver mais de uma ID com o mesmo nome. E para identifica-la no css, usa-se o cerquilha (#)
<div id="wrap">
<h1> Seu trabalhos</h1>
</div>
<div class="container">
<h1> Seu texto de apresentação</h1>
</div>
<div class="container">
<h1> Seu currículo</h1>
</div>
#wrap{
background-color: blue;
}No exemplo acima, somente o ID wrap irá estilizar o fundo com a cor azul.
Uma boa prática com desenvolvimento web é utilizar mais classes pelo seu poder de ser reutilizada várias vezes. Enquanto o ID é exclusivo, você não terá esse mesmo poder.
Espero ter te ajudado!
Ajudou sim! Muito obrigado!!!