Ausschließen bestimmter Klassennamen in CSS Selectors

In CSS gibt es Instanzen, in denen Sie möglicherweise bestimmte Klassennamen von Ihren Selektoren ausschließen müssen. Dies ist besonders nützlich, wenn Sie Stile auf mehrere Elemente anwenden möchten, aber bestimmte sollten diese Stile nicht erben.

Ein gemeinsames Szenario besteht darin, Elemente mit einem bestimmten Klassennamen auszuschließen, während Sie Stile auf Elemente mit einem anderen Klassennamen anwenden. Betrachten wir das folgende Beispiel:

    Design



    Design

In diesem Beispiel möchten wir eine Hintergrundfarbe auf Elemente mit dem Klassennamen "remode_hover" auf schweber anwenden. Wir möchten diese Farbe jedoch nicht anwenden, wenn das Element auch den Klassennamen "remode_selected" hat. .remode_selected .remode_hover: hover {} .Remode_Hover: Hover {Hintergrundfarbe: #f0AC00; }

/* Do not apply background-color (leave empty) */
.reMode_selected .reMode_hover:hover { }

.reMode_hover:hover { background-color: #f0ac00; }

. }

 Diese Regel wendet die Hintergrundfarbe auf .Remode_Hover -Elemente an, die den Namen .remode_Selected Class -Name nicht haben. Infolgedessen erhält nur der erste Link die Hintergrundfarbe für Schwebungen, während der zweite Link dies nicht.