Diferenças entre Classes e IDs
Publicado por Rafael Vergani | em CSS, Web Standards | Data 09 Dec 2009
Tags: classes, CSS, html, Web Standards
0
Quando escrevemos nossos primeiros códigos na carreira surge a dúvida “Devo usar ID ou Class?“.
A partir dessa pergunta cria-se bastante confusão e muitos acabam utilizando qualquer uma das duas opções sem saber qual a mais adequada.
Inicialmente ambos parecem “fazer a mesma coisa”, mas vamos ver algumas diferenças importantes:
1 – Classes não são únicas
- É possível utilizar a mesma classe para muitos elementos;
<div class=”box”></div>
<div class=”box”></div>
<div class=”box”></div>
- Um elemento pode possuir diversas classes.
<div class=”box”></></div>
<div class=”box big”></></div>
<div class=”box big left”></></div>
2 – IDs são únicos
- Cada elemento só pode ter um ID;
- Cada página só pode ter um elemento com aquele ID.
Importante: seu código não vai ser válido se você usar o mesmo ID para dois elementos.
2.1 – IDs possuem funcionalidades específicas
Ao contrário das classes que não possuem funcionalidades especiais nos browser, os IDs têm o que chamamos de “valor de hash” para URL’s.
Ex: se você digitar www.rafaelvergani.com/#contato, o navegador vai localizar o elemento com ID=”contato” e automaticamente vai exibir essa parte do conteúdo na tela.
3 – Elementos podem ter classes e IDs simultaneamente
Você pode declarar classes e IDs em um elemento desde que você respeite a regra número 2 citada acima.
<div id=”imagem” class=”semBorda”>
Espero ter esclarecido algumas dúvidas com este artigo.
Rafael Vergani