Heim >Web-Frontend >CSS-Tutorial >Wie kann ich Elemente ohne bestimmte Klassen oder Attribute in CSS auswählen?
Wie kann ich Elemente ohne bestimmte Klassen oder Attribute in CSS auswählen?
- Patricia ArquetteOriginal
- 2024-12-17 21:55:16333Durchsuche
Negieren von Klassen- und Attributselektoren in CSS
Müssen Sie Elemente auswählen, denen bestimmte Klassen oder Attribute fehlen? CSS bietet eine Lösung durch die Pseudoklasse :not().
:not() Pseudoklasse
Die Pseudoklasse :not() ermöglicht es Ihnen negiert einen Selektor und wählt Elemente aus, die nicht den angegebenen Kriterien entsprechen. Typischerweise werden Klassenselektoren wie folgt verwendet:
:not(.printable) {
/* Styles for non-printable elements */
}
Ebenso können Attributselektoren negiert werden:
:not([attribute]) {
/* Styles for elements without the attribute */
}
Beispiel
Bedenken Sie das folgender HTML-Code:
<html>
Um alle Elemente auszuwählen, die nicht über die Option „druckbar“ verfügen Klasse verwenden Sie die folgende CSS-Regel:
:not(.printable) {
background-color: lightgray;
}
Dadurch werden die Navigations- und a-Elemente hellgrau hervorgehoben.
Browserunterstützung und -alternativen
IE8 und älter unterstützen :not() nicht. Alternativ können Sie Stilregeln für Elemente erstellen, die über die Klasse „druckbar“ verfügen. Wenn dies nicht möglich ist, erwägen Sie eine Umstrukturierung Ihres Markups, um den Einschränkungen Rechnung zu tragen.
Überlegungen
Eigenschaften wie display: none on :not(.printable) entfernen das vollständig Element und seine Nachkommen aus dem Layout. Um dies zu vermeiden, verwenden Sie stattdessen „visibility:hidden“, wodurch sichtbare Nachkommen angezeigt werden können, während die ausgeblendeten Elemente weiterhin das Layout beeinflussen.
Das obige ist der detaillierte Inhalt vonWie kann ich Elemente ohne bestimmte Klassen oder Attribute in CSS auswählen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!