De acordo com as Leis 12.965/2014 e 13.709/2018, que regulam o uso da Internet e o tratamento de dados pessoais no Brasil, ao me inscrever na newsletter do portal DICAS-L, autorizo o envio de notificações por e-mail ou outros meios e declaro estar ciente e concordar com seus Termos de Uso e Política de Privacidade.
Colaboração: Maurício (Maujor) Samy Silva
Data de Publicação: 26 de setembro de 2017
É uma estrutura condicional destinada a selecionar um ou mais elementos da árvore do documento.
Diz-se que um seletor CSS seleciona um (ou mais) elemento(s) da marcação quando a estrutura condicional resulta, ou casa, ou aponta, para o(s) elemento(s) por ele selecionados. O(s) elemento(s) selecionado(s) é(são) o(s) alvo(s) do seletor.
Seletores CSS são usados para se definir regras CSS a serem aplicadas ao(s) elemento(s) com o(s) qual(is) casam.
Os seletores simples e seus alvos são listados a seguir:
id
.
class
.
O encadeamento de dois ou mais seletores simples separados por elementos de combinação formam um seletor composto.
Elemento de combinação é um sinal gráfico destinado a separar seletores simples com a finalidade de se criar seletores compostos.
Os elementos de combinação de seletores e seus significados listados a seguir:
Pseudoelementos são adicionados aos seletores e permitem casar com partes do documento não explicitamente contidas na árvore do documento, tais como a primeira letra ou a primeira linha de um parágrafo.
Um seletor é uma cadeia composta de um ou mais seletores simples separados por elementos de combinação podendo ou não terminar com um pseudoelemento.
Observe a seguir exemplos da sintaxe de seletores CSS para um documento HTML.
Exemplo | Explicação |
---|---|
p { ... } |
seletor simples de parágrafos |
div p { ... } |
seletor composto descendente |
#div { ... } |
seletor ID |
.destaque { ... } |
seletor classe |
input[type='password"] { ... } |
seletor de atributo |
*{ ... } |
seletor universal |
section > div p { ... } |
seletor composto descendentes de elemento-filho |
h2 + p { ... } |
seletor irmão imediatamente adjacente |
h1 ~ p { ... } |
seletor irmãos em geral |
h2:first-letter { ... } |
pseudoelemento |
Maurício Samy Silva também conhecido como "Dinossauro das CSS" ou simplesmente Maujor® é graduado em Engenharia Civil pelo Instituto Militar de Engenharia (IME).
No segundo semestre de 2003, com a pretensão de suprir a falta de material de consulta gratuita, em língua portuguesa, na internet, decidiu criar o site de tutoriais denominado Maujor, hospedado em http://www.maujor.com/ e destinado a divulgar as técnicas de desenvolvimento frontend. Maujor é autor de 15 livros de desenvolvimento web (http://livrosdomaujor.com.br) e está escrevendo mais um sobre CSS Grid Layout com previsão de lançamento em novembro de 2017.
Saiba mais: Facebook , Twitter.
This policy contains information about your privacy. By posting, you are declaring that you understand this policy:
This policy is subject to change at any time and without notice.
These terms and conditions contain rules about posting comments. By submitting a comment, you are declaring that you agree with these rules:
Failure to comply with these rules may result in being banned from submitting further comments.
These terms and conditions are subject to change at any time and without notice.
Comentários