Qual usar ou? [duplicado]

esta pergunta já tem uma resposta aqui:

  • Qual é a diferença entre uma identificação e uma aula? 14 respostas
Estou a aprender HTML. Alguém me pode dizer qual é a diferença entre classe e id e quando usar um em vez do outro? Eles parecem fazer a mesma coisa.
<!DOCTYPE HTML>
<html>
<head>

<style>

#mycolor1 {color: red;}    
.mycolor2 {color: red;}

</style>

</head>
<body>

<div id="mycolor1">     hello world </div>
<div class="mycolor2">     hello world </div>

</body>
</html>
 6
Author: steve h, 2013-05-30

10 answers

Eles não fazem a mesma coisa.id é usado para atingir um elemento específico, classname pode ser usado para atingir vários elementos.

Exemplo:

<div id="mycolor1" class="mycolor2">     hello world </div>
<div class="mycolor2">     hello world2 </div>
<div class="mycolor2">     hello world3 </div>

Agora, você pode consultar todos os divcom o nome de classe mycolor2 de uma vez usando

.mycolor2{ color: red } //for example - in css

Isto iria definir todos os nós com classe mycolor2 para red.

No entanto, se quiser definir especificamente mycolor1 para blue, pode apontá-lo especificamente assim:

#mycolor1{ color: blue; }
 18
Author: karthikr, 2013-05-30 15:46:21

Leia a especificação dos atributos e para CSS .

  • Deve ser único. class não tem de ser
  • id tem mais alto (mais alto!) especificidade em CSS
  • Os elementos podem ter várias classes não ordinais (separadas por espaços), mas apenas uma id
  • é mais rápido seleccionar um elemento pelo seu ID ao questionar o DOM
  • id pode ser usado como alvo de âncora (usando o fragmento do pedido) para qualquer elemento. name só funciona com âncoras (<a>)
 11
Author: Explosion Pills, 2013-05-30 15:47:39

Devem ser usadas Classes quando se tem vários elementos semelhantes.

Ex: muitas das letras de música que o div mostra, você poderia atribuir-lhes uma classe de {[[0]}, uma vez que são todas semelhantes.

As identificações devem ser únicas! São utilizados para atingir elementos específicos

Ex: uma entrada para um e-mail de utilizadores poderia ter o ID txtEmail -- nenhum outro elemento deveria ter este ID.

 1
Author: tymeJV, 2013-05-30 15:46:58

O objecto em si não mudará. A principal diferença entre estas duas palavras-chave é a utilização:

  • oID é geralmente único na página
  • a classe pode ter uma ou muitas ocorrências

Nos ficheiros CSS ou Javascript:

  • o ID será acedido pelo carácter #
  • A classe será acedida pelo carácter .
 1
Author: Philibobby, 2013-05-30 15:48:57

Para colocá-lo simnply: o id é único para apenas um elemento em todo o documento HTML, mas a classe pode ser adicionada a vários elementos.

Além disso, as propriedades do ID têm prioridade sobre as propriedades da classe.

Ids e classes são especialmente úteis se você planeja usar javascript ou qualquer um de seus frameworks.

 1
Author: Kontakt Ikaizen, 2013-05-30 15:49:02

A classe é usada quando u quer definir propriedades para um grupo de elementos, mas o id pode ser definido para apenas um elemento.

 0
Author: Faridzs, 2013-05-30 15:46:09

ID's must be unique( only be given to one element in the DOM at a time), whereas classes don't have to be. Você já descobriu a classe css {[[0]} e prefixos de ID #, então é basicamente isso.

 0
Author: Bojangles, 2013-05-30 15:46:21

O ID fornece um identificador único para o elemento, no caso de querer manipulá-lo em JavaScript. O atributo class pode ser usado para tratar um grupo de elementos HTML da mesma forma, particularmente no que diz respeito a fontes, cores e outras propriedades do estilo...

 0
Author: Sparky, 2013-05-30 15:47:33

O ID é adequado para os elementos que aparecem apenas uma vez Comer Logótipo da barra lateral

E a classe é adequada para os elementos que têm a mesma UI, mas podem aparecer mais de uma vez. Tipo

.alimentar o recipiente #feeds

 0
Author: , 2013-05-30 15:48:49
  • o selector de Id é usado quando se refere a um único elemento único.
  • o selector de classes referencia um grupo de elementos.

Por exemplo, se tiver vários botões com o mesmo aspecto, deve usar class="mybutton" para ter estilo consistente.

Em termos de desempenho:

Os selectores CSS sãocombinados da direita para a esquerda .

Portanto,.myClass deve ser " mais rápido "do que # myID porque ele perde teste.

A velocidade de desempenho é insignificante para páginas de tamanho normal e você provavelmente nunca vai notar uma diferença, por isso é principalmente sobre Convenção.

Aqui está mais informação sobre porque é que o CSS é os navegadores correspondem aos selectores de css da direita para a esquerda

 0
Author: im_benton, 2017-05-23 12:17:23