En CSS, comme dans n’importe quel autre langages, il y a moult manières de parvenir à un résultat. Les pseudo-classes c’est le truc vieux comme le monde mais généralement on n’utilise que très fréquemment les plus courantes, du genre les :hover, les :first-child ou encore les :nth-child quand on veut traiter la mise en forme d’une liste.

Le truc c’est qu’avec les updates du CSS, il y en a des nouvelles et si on ne se tient pas un minimum à jour, on reste alors coincés dans nos bonnes vieilles habitudes. Aujourd’hui je suis tombé complètement par hasard sur la pseudo-classe :not()

La pseudo-classe de négation, :not(), est une notation fonctionnelle qui prend un sélecteur comme argument. Elle permet de cibler les éléments qui ne sont pas représentés par cet argument. Le sélecteur passé en argument ne doit pas contenir d’autre sélecteur de négation.

Ça c’est la définition du codex Mozilla. Dans la pratique, c’est plutôt comme passer des propriétés de style à tous les éléments qui n’ont pas l’id ou la class compote par exemple.

Exemple :

On prend une pomme, sa hauteur est de 8cm soit 300px. Pour qu’elle rentre dans son conteneur (div) on doit lui fournir la hauteur adéquate. Or, nos div actuelles sont conçues pour la compote uniquement. En utilisant intelligemment la pseudo-classe :not, on pourrait :
div:not(.compote) {
height:300px;

}

div.compote {
height 50px;

}
Ça vous semble clair ? Sans la pseudo-classe :not() il aurait fallu peut être créer une nouvelle class ou un id afin de spécifier une hauteur différente.