Wie schließe ich Elemente mit einem bestimmten Klassennamen in CSS-Selektoren aus?

Bestimmte Klassennamen in CSS-Selektoren ausschließen

In CSS ist es oft notwendig, Elemente basierend auf bestimmten Klassennamen anzusprechen. Wenn jedoch mehrere Klassennamen für ein Element vorhanden sind, kann das Targeting komplexer werden. Eine häufige Herausforderung besteht darin, Elemente auszuschließen, die einen bestimmten Klassennamen haben.

Stellen Sie sich das folgende Szenario vor:

• Sie möchten eine Hintergrundfarbe anwenden, wenn die Maus über ein Element mit dem „ reMode_hover“-Klasse.
• Sie möchten jedoch die Farbe nicht ändern, wenn das Element auch die „reMode_selected“-Klasse hat.

Um Elemente mit einem bestimmten Klassennamen auszuschließen, müssen Sie kann den „nicht“-Selektor verwenden. Mit diesem Selektor können Sie auf Elemente abzielen, die einer bestimmten Bedingung nicht entsprechen. In diesem Fall würden Sie Folgendes verwenden:

<code class="css">.reMode_hover:not(.reMode_selected):hover {
  background-color: #f0ac00;
}</code>

Dieser Selektor würde die Hintergrundfarbe auf jedes Element mit der Klasse „reMode_hover“ anwenden, solange es nicht auch die Klasse „reMode_selected“ hat. Elemente, die beide Bedingungen erfüllen, werden effektiv ausgeschlossen.

Das obige ist der detaillierte Inhalt vonWie schließe ich Elemente mit einem bestimmten Klassennamen in CSS-Selektoren aus?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!