No CSS os seletores organizam a página e dependendo da escolha facilita a manutenção. São usados para padronizar elementos estilizando de características semelhantes. Neste post abordo quatro tipos.
Id
Este seletor considera o valor do Id. Por padrão, deve ser único por página. Navegadores "consideram" a multiplicidade de Id em uma página, mas se por exemplo for implementar javascript, com a função getElementById() o resultado é ineficaz.
- Sintaxe: #id
- Único por página
- Não reutilizável
- Rígidos
Tag
Também conhecido como seletor de tipo. Quando aplicado, todas as suas instâncias terão o mesmo comportamento. Um bom uso para a regra é usá-la na técnica de reset.
O reset "limpa" as configurações preestabelecidas dos navegadores. Dessa forma, evita conflitos, suaviza as diferenças e alinha o estilo nos browsers.
- Sintaxe: tag {propriedade : valor}
- Associado ao objeto identificável do HTML;
- Sem limitações por página;
Class
Confere melhor visualização e manutenção do código. Pode ser usado em tags diferentes para apresentar os mesmos efeitos. Os componentes não ficam limitados as tags e sim a class.
- Sintaxe: .class {propriedade : valor}
- Mais usado
- Facilita a manutenção
- Sem limitações por página
- Reutilizável
*
Seletor universal. Quando aplicado, todos os elementos da página terão o mesmo efeito. Muito usado em testes e não recomendado por deixar a página pesada. Pode ser usado como um seletor filho.
Top comments (0)