Classe vs ID
Cascading Style Sheets (CSS) é uma linguagem que descreve a aparência e a formatação de um documento escrito usando uma linguagem de marcação. CSS é amplamente usado para estilizar páginas da web escritas em HTML. CSS permite especificar seus próprios seletores de estilo, além de aplicar estilos para elementos HTML. Isso é feito usando os seletores de ID e classe. Ao especificar um estilo para um único elemento exclusivo, o seletor de ID é usado. Ao especificar um estilo para um grupo de elementos, o seletor de classe é usado.
O que é uma classe?
Em CSS, o seletor de classes pode ser usado para aplicar seu próprio estilo a um grupo de elementos. O seletor de classes é usado para aplicar um estilo específico a um conjunto de elementos com a mesma classe. Em CSS, um seletor de classe é identificado por um ponto final (.). A seguir está um exemplo de um seletor de classe definido em CSS.
.minha classe {
cor azul;
intensidade da fonte: Negrito;
}
HTML pode se referir à classe definida em CSS usando o atributo class conforme mostrado abaixo.
Esta é a minha formatação
Esta é a minha formatação novamente
Conforme mostrado acima, a mesma classe pode ser usada para vários elementos e um único elemento pode usar várias classes. Quando várias classes são usadas no mesmo elemento, as classes são inseridas no atributo class delimitado por um espaço conforme mostrado abaixo.
Esta é minha formatação usando duas classes
O que é um ID?
Em CSS, o seletor de ID pode ser usado para aplicar seu próprio estilo a um único elemento único. No CSS, um seletor de ID é identificado por um hash (#). A seguir está um exemplo de um seletor de ID definido em CSS.
#minha identidade {
cor vermelha;
alinhamento de texto: direita;
}
HTML pode se referir ao seletor de ID definido no CSS usando o atributo id conforme mostrado abaixo.
Esta é a minha formatação para um seletor de ID
IDs são únicos. Portanto, cada elemento pode ter apenas um único ID e cada página pode ter apenas um único elemento com esse ID específico. Os IDs têm uma característica importante que pode ser usada com um navegador. Se o URL da página contiver um valor hash (por exemplo, https://myweb.com#my_id), o navegador tentará localizar automaticamente o elemento com o ID “my_id” e rolar a página da web para exibir esse elemento. Esse é um dos motivos pelos quais a página deve ter um único elemento com esse ID específico, para que o navegador possa localizar esse elemento.
Qual é a diferença entre Class e ID?
Embora o seletor de classe e o seletor de ID possam ser usados para aplicar seu próprio estilo a elementos em uma página da web, eles têm algumas diferenças importantes. O seletor de classe pode ser usado para aplicar seu próprio estilo a um grupo de elementos, enquanto o seletor de ID é usado para aplicar um estilo a um único elemento exclusivo. Ao usar IDs, cada elemento pode ter apenas um único ID e cada página pode ter apenas um único elemento com esse ID específico, mas a Classe pode ser usada para vários elementos e um único elemento pode usar várias Classes. Além disso, o ID pode ser usado para rolar uma página automaticamente para exibir o elemento com aquele ID, mas isso não é possível com o seletor de classe.
