No CSS3 já era possível excluir um elemento de uma seleção. Algo mais ou menos assim:
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| p:not(.highlight) { | |
| color: blue; | |
| } |
No exemplo acima, selecionamos todos elementos p exceto as que tem a classe highlight. Já é coisa linda, certo? Mas se quiséssemos colocar um filtro a mais na negação não é possível. Aí vem o CSS level 4 e dá uma tunada nisso.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| p:not(:first-child):not(:last-of-type):not(.highlight) { | |
| color: blue; | |
| } |
No exemplo acima, conseguimos selecionar todos elementos p excluindo os que são :first-child, :last-of-type e que possuem a classe highlight.
Aqui é possível ver um exemplo com os códigos acima.