Fórum CSS - selecao por id, classe, elemento? #515061

28/03/2015

0

Front-end

Sobre os tipos de seleções "seletores CSS": id, classe e elemento, quais deles são os melhores, mais utilizados, considerados padrões para o desenvolvimento web atual?
Gabriela Monte

Gabriela Monte

Responder

Post mais votado

28/03/2015

Gabriela, melhor explicação que achei, bem simples de entender mesmo

[url]http://guilhermemuller.com.br/pt/elearning/html_css_basico/licao/2/sintaxe-seletores-css[/url]

Marcelo Pastore

Marcelo Pastore
Responder

Gostei + 1

Mais Posts

28/03/2015

Marisiana Battistella

Gostei do artigo Marcelo!!
Responder

Gostei + 0

29/03/2015

Marcelo Pastore

Gostei do artigo Marcelo!!


É ótimo esse artigo, bem simples.
Responder

Gostei + 0

29/03/2015

Marisiana Battistella

Sim =) é explicativo e já tem os exemplos práticos. Fácil de entender!
Responder

Gostei + 0

29/03/2015

Marcelo Pastore

Sim =) é explicativo e já tem os exemplos práticos. Fácil de entender!


Pena o site não ser dedicado a esses artigos, não achei mais nada nele, se tivesse mais artigos do tipo seria melhor.
Responder

Gostei + 0

29/03/2015

Gabriela Monte

Já ajudou bastante.
Responder

Gostei + 0

30/03/2015

Thiago Santana

Legal o artigo!
Eu costumo utilizar o id para seletores
Responder

Gostei + 0

30/03/2015

William

Não é minha área, mas trabalhei com um cara especialista em desenvolvimento Front-End, ele sempre dizia que preferia usar classes pois poderia usar várias na mesma TAG para reaproveitar estilos e flexibilizar o código.

Podemos ver um pouco disso no bootstrap!
Responder

Gostei + 0

30/03/2015

Thiago Santana

Não é minha área, mas trabalhei com um cara especialista em desenvolvimento Front-End, ele sempre dizia que preferia usar classes pois poderia usar várias na mesma TAG para reaproveitar estilos e flexibilizar o código.

Podemos ver um pouco disso no bootstrap!


Também entendo muito pouco!
Mas as classe são as melhores saídas, pois se torna reutilizáveis.
Responder

Gostei + 0

30/03/2015

Gabriela Monte

Eu vendo varios exemplos, id e classes são mais utilizadas.
Responder

Gostei + 0

30/03/2015

Marcelo Pastore

Não é minha área, mas trabalhei com um cara especialista em desenvolvimento Front-End, ele sempre dizia que preferia usar classes pois poderia usar várias na mesma TAG para reaproveitar estilos e flexibilizar o código.


Concordo, o uso de classes se torna mais completo.
Responder

Gostei + 0

30/03/2015

Jothaz

O que o William postou procede, Class deixa o código dinâmico e podem ser reutilizadas em outros controles.

Claro que tudo depende do cenário, e as vezes pode-se utilizar Id sem problemas.

Quem esta desenvolvendo define o que é melhor de se utilizar levando-se em conta o conhecimento do projeto como um todo.

Não se pode ser maniqueísta e simplificar em certo ou errado e sim levar-se em conta as boas práticas.
Responder

Gostei + 0

30/03/2015

Thiago Santana

Muitas vezes precisamos de algo específico para um determinado componente!
Então se faz necessário o uso de ID, isso vai variar muito...
Responder

Gostei + 0

30/03/2015

Marcelo Pastore

Senhores, eu estou por fora, mas podem me citar exemplos praticos em quais momento devemos utilizar um ou outro?

Obrigado
Responder

Gostei + 0

31/03/2015

Jothaz

Senhores, eu estou por fora, mas podem me citar exemplos praticos em quais momento devemos utilizar um ou outro?

Obrigado


É dificil e eu não gosto de abordar temas ditando regras, como foi dito, tudo depende do cenário e da abstração/compreensão de quem esta desenvolvendo.
A regra é não ter regras, mas bom senso e compreensão de onde quer se chegar.

Por serem dinâmicas e reaproveitáveis as classes são consideradas como uma boa prática.
Agora dependendo do que você esta desenvolvendo e do resultado esperado pode-se usar o ID.
Uma utilização do ID poderia ser nos controles de cabeçalho e rodapés, o que garantiria que somente eles seriam afetados pele CSS.
Claro que poderia ser classes, mas se você preferir usar ID é um gosto pessoal e não podeira ser considerado erro.

Um cenário para o uso de ID, que talvez melhore a compreensão, seria:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
minha_div {
    height: 200px;
    width:  200px;
}
 
cor_ativo {
    background-color: green;
}
 
cor_inativo {
    background-color: gray;
}
 
cor_atrasado {
    color: rede;
}
 
#destaque {
    border: 10px 10px 10px 10px;
}
 
<div id="controle1" class="minha_div cor_ativo"></div>
<div id="controle2" class="minha_div cor_inativo"></div>
<div id="controle3" class="minha_div cor_ativo cor_atrasado"></div>
<div id="destaque" class="minha_div cor_ativo"></div>


No cenário acima todos os controles herdam de "minha_div".
O "controle1" herda de "minha_div" e "cor_ativo".
O "controle2" herda de "minha_div" e "cor_inativoativo".
O "controle3" herda de "minha_div", "cor_ativo" e "cor_atrasado".
O "destaque" herda de "minha_div", "cor_ativo" e por ter o ID somente ele herda de "#destaque".

Vejo algumas repostas argumentando que por uma abordagem ser a mais utilizada nos sites e nos pretensos tutoriais seria a "correta".
Cuidado com este tipo de argumento, nem sempre o que é mais usado é o correto.
As vezes é mais usado simplesmente porque ninguém se deu ao trabalho de questionar ou aprender o conceito corretamente.

O argumento pode até ser "normalmente é a a abordagem mais utilizadas em grande sites ou site realmente profissionais".

Lembre-se durante muito tempo para a grande maioria era válido: a teoria heliocêntrica, a teoria da geração espontânea e até ingerir larvas de soiltarias (tênia) era considerado remédio para emagrecer.

Então tenham sempre um senso critico e inquiridor!


Deu uma luz?
Responder

Gostei + 1

31/03/2015

Thiago Santana

Boa Jothaz!
Exatamente isso...
Responder

Gostei + 0

Mais tópicos

Utilizamos cookies para fornecer uma melhor experiência para nossos usuários, consulte nossa política de privacidade.

Aceitar