Articles of seletores css

Seletor CSS para selecionar o primeiro elemento de uma determinada class

Estou tentando selecionar um primeiro elemento da class ‘A’ em um elemento com id ou class ‘B’. Eu tentei uma combinação de seletores de + e primeiro filho, já que não é um primeiro elemento dentro do elemento de class ‘B’. Funcionou, mas … eu estou tentando sobrescrever alguns css padrão e não tenho controle […]

: not () selector não se comportando da mesma forma entre o Safari e o Chrome / Firefox

Estou tendo muita dificuldade em descobrir por que o código a seguir é exibido em azul no Safari, mas em vermelho no Chrome e no Firefox. em:not(div) { color: red } em:not(p div) { color: blue } FOO https://jsfiddle.net/hzcLpf9L/ Aparentemente, parece que o Chrome e o Firefox não suportam :not() seletores CSS com vários níveis […]

Por que o seletor .foo a: link, .foo a: visited {} sobrescreve um seletor: hover, a: active {} em CSS?

Exemplo de código: http://jsfiddle.net/RuQNP/ Foo a:link, a:visited { color: blue; } a:hover, a:active { color: red; } .foo a:link, .foo a:visited { color: green; } /* A possible fix */ /* .foo a:hover, .foo a:active { color: red; } */ Example O que eu estava esperando: O link apareceria vermelho ao passar o mouse. O […]

O que as vírgulas e espaços em várias classs significam em CSS?

Aqui está um exemplo que eu não entendo: .container_12 .grid_6, .container_16 .grid_8 { width: 460px; } Parece-me que width: 460px é aplicado a todas as classs acima mencionadas. Mas por que algumas classs são separadas por uma vírgula ( , ) e algumas apenas por um espaço? Eu suponho que width: 460px será aplicada apenas […]

O que significa “i” em um seletor de atributo de CSS?

Encontrei o seguinte seletor de CSS na folha de estilo do agente do usuário do Google Chrome: [type=”checkbox” i] O que i quero dizer?

Usando o seletor de último filho

Meu objective é aplicar o CSS no último li , mas isso não acontece. #refundReasonMenu #nav li:last-child { border-bottom: 1px solid #b5b5b5; } abcde xyz Como posso selecionar apenas o último filho?

Selecione o elemento com base em várias classs

Eu tenho uma regra de estilo que desejo aplicar a uma tag quando ela tem dois estilos. Existe alguma maneira de realizar isso sem JavaScript? Em outras palavras: Quero aplicar minha regra de estilo somente se o li tiver as classs .ui-class-selector e .ui-class-selector aplicadas.

Como combinar class e ID no seletor CSS?

Se eu tiver o seguinte div: Lorem Ipsum… Existe uma maneira de definir um estilo que expresse a ideia “Uma div com id=’content’ AND class=’myClass’ “? Ou você simplesmente segue um caminho ou outro como em Lorem Ipsum… Ou Lorem Ipsum…

O que faz um Asterisk (*) em um seletor CSS?

Eu encontrei este código CSS e eu corri para ver o que ele faz e delineou CADA elemento na página, Alguém pode explicar o que o Asterisk * faz no CSS? * { outline: 2px dotted red } * * { outline: 2px dotted green } * * * { outline: 2px dotted orange } […]

Seletor CSS baseado no texto do elemento?

Duplicar Possível: Existe um seletor de CSS para elementos contendo determinado texto? Existe uma maneira de selecionar um elemento no css com base no texto do elemento? ie: li[text=*foo] foo bar Isso provavelmente não funciona. Edit: também só precisa apoiar o Chrome.