Pular para o conteúdo principal

CSS: ID e Class, o que são e quando usar


Como muita coisa no temido CSS, muitas pessoas tem dúvidas em relação ao ID e Class, o que é normal. Então vamos ver de forma simples o que é cada um deles e quando usar.

ID é um identificador ou seletor para um elemento no HTML, e este deve ser único em todo o corpo do documento, e assim o CSS será aplicado para este elemento em específico. É algo que funciona como o número do documento de identidade, ou seja, é como devemos identificar os elementos como imagens, divs, parágrafos em nossa página. É também a forma mais correta para este fim, mas muitos usam classes – e funciona – mas não é indicado, e podem ter alguns problemas ao usar Javascript por exemplo, pois classe pode ser usada em vários elementos HTML da página, e o ID dever ser usado em apenas um. No CSS ele é identificado pelo sinal # (sharp) e no HTML o nome do ID fica no parâmetro id=”” sem o sinal #.

Exemplo:
CSS
#meuelemento{
color: #000;
}

#meuOutroElemento{
color: #333;
margin: auto;
}

HTML

<div id=”meuelemento”>
Aqui é uma div com um ID único
</div>

<div id=”meuOutroElemento”>
Aqui é outra div com uma ID diferente, pois o ID não pode ser repetido
</div>


Class é um identificador ou seletor para uma classe de elementos no HTML, e pode ser usada para identificar vários elementos. Este tipo de identificador aplica as mesma características para todos os elementos que a usam. É algo como a cor dos cabelos, quando temos uma classe Loiro, todos dessa classe terão os cabelos amarelos. Ele pode ser usado em quase todos os elementos do HTML, incluindo imagens, divs, parágrafos e muitos outros. Ele é reconhecido no CSS por um ponto (.) e no HTML pelo parâmetro class=””, sem o sinal do ponto.

Exemplo:
CSS
.meuselementos{
color: #333;
background-color:#f1f1f1;
}

HTML
<div class=”meuselementos”>

Aqui é uma div com seu conteúdo

</div>

<div class=”meuselementos”>

Aqui é outra div diferente, mas com a mesa classe da div anterior, logo elas terão as mesmas características definidas na Class “meuselementos”

</div>

Conclusão
Podemos observar nos exemplos que o ID deve ser único em uma página HTML e assim as característica desse ID serão únicas para aquele elemento. E a Class pode ser usada para aplicar as mesmas características em vários elementos que a tenham declarado.

Espero que tenha entendido. Qualquer dúvida é só postar um comentário. Fique na Paz!

Postagens mais visitadas deste blog

JDownloader: Corrigir erro Skipped FFMpeg ao baixar do Youtube

Há tempos eu vinha tendo problemas ao baixar vídeos do Youtube.com. Quando instalei a versão 2 do JD, apareceu-me uma janela que eu não tinha visto antes:



Veja o erro que acontecia ao tentar baixar um vídeo do Youtube, na imagem abaixo:

Sem tanta necessidade do download, eu sempre deixei para depois, mas em um momento eu precisei, e muito, então resolvi pesquisar e vi em alguns fóruns, em inglês, que poderia ser algum problema na linha de comando na configuração do JDownloader para o uso do FFMpeg. Mas ao checar o painel de configurações, os comandos estavam certos, mas o caminho do arquivo binário do FFMpeg não estava lá, tinha apenas "null", ou seja, nulo.

Então, para corrigir, se este for o seu problema, encontre o caminho do FFMpeg no seu sistema, seja ele Windows ou Linux. No caso do Windows, o arquivo binário ffmpeg.exe pode estar diretamente no disco C(ou outra unidade onde o S. O. estiver instalado) ou em Arquivos de Programas, se não encontrar, tente fazer uma pesqu…

Corrigindo erro ao instalar o Netbeans no Linux: UncaughtExceptionHandler in thread "main"

Ao tentar instalar o Netbeans 8.0.2 no Mageia 5, me deparei com um erro, onde ele não abria a tela de instalação, então rodei ele pelo terminal e tive a seguinte saída: 

$ ./netbeans-8.0.2-php-linux.sh
Configurando o instalador ...
Procurando por um JVM no sistema...
Extraindo dados para instalação...
Executando o assistente do instalador...

Exception: java.awt.HeadlessException thrown from the UncaughtExceptionHandler in thread "main"

Então após umas pesquisadas na Internet, cheguei à conclusão que era um problema no caminho do Java JDK que não está configurado corretamente, então basta executar o Netbeans informando o local do JDK:


./netbeans-8.0.2-linux.sh --javahome /usr/java/jdk1.8.0_25/
 No meu caso a localização do JDK foi "/usr/java/jdk1.8.0_25/', verifique o caminho da sua versão do JDK e também para sua versão do Linux. Acredito que esse erro possa acontecer no Windows em alguns casos, mas aí já é coisa pra um futuro tutorial.

Espero ter ajudado. Se te ajudou, com…

Corrigindo erro de conexão do MySQL Workbench no Linux

Se você está com problemas na conexão local do seu MySQL Workbench, possivelmente você viu essa janela abaixo:


Se viu, você está tendo o mesmo problema que já tive algumas vezes, então, uma provável solução é um post que eu fiz em 2011, onde acontecia um erro parecido ao tentar usar o MySQL localmente sendo acessado pelo Java. Aqui está o link:

http://blog.cledilsonweb.com.br/2011/01/erro-comunications-link-failure-do-java.html

Espero que ajude. Qualquer dúvida, pode postar nos comentários. Obrigado e fique na Paz!