: Wo () hat auch einen coolen Spezifitätstrick.

:is() und :where() sind CSS-Pseudo-Selektoren, die ähnliche Funktionen bieten, aber signifikant in der Spezifität unterschiedlich sind. Kürzlich: :is() hat aufgrund einer breiteren Browserunterstützung an Popularität gewonnen und komplexe Selektoren vereinfachen. Allerdings: :where() bietet einen entscheidenden Vorteil bei der Kontrolle der Spezifität.

:is() erbt die Spezifität seines spezifischsten Arguments. Dies kann vorteilhaft sein, um die Spezifität zu erhöhen, ohne zusätzliche Klassen hinzuzufügen, wie gezeigt:

 : IS (.button, #erhöhen #Spezifität) {
  / * Spezifität nimmt zu *//
}

Umgekehrt :where() hat immer keine Spezifität, unabhängig von ihren Argumenten. Dies ist besonders nützlich, um die Spezifität in Situationen zu senken, in denen ein Selektor mit höherer Spezifität einen allgemeineren Stil unbeabsichtigt außer Kraft setzen kann. Betrachten Sie dieses Beispiel:

 .Card: IS (.Title, p) { / * hohe Spezifität aufgrund von .title * /
  Farbe: Rot;
}

.Card p { / * niedrigere Spezifität * /
  Farbe: Gelb;
}

Hier gewinnt red Gewinne aufgrund von :is() ererbter Spezifität. Wechsel zu :where() ändert das Ergebnis:

 .Card: Wo (.title, p) { / * Nullspezifität * /
  Farbe: Rot;
}

.Card p { / * niedrigere Spezifität, gewinnt aber immer noch * /
  Farbe: Gelb;
}

Jetzt herrscht yellow , weil :where() die Spezifität von geringer ist.

Auswählen zwischen :is() und :where() hängt von Ihren spezifischen Bedürfnissen ab. Im Allgemeinen wird für seine Einfachheit angefangen mit :is() empfohlen. Wenn Sie jedoch auf Konflikte auf Spezifität stoßen :where() ein leistungsstarkes Instrument zur Verwaltung und Reduzierung der Spezifität bietet und nicht beabsichtigte Stilüberschreibungen verhindern. Während eine geringe Spezifität im Allgemeinen für die Wartbarkeit bevorzugt wird, kann die extreme Nullspezifität von :where() seine eigene Komplexität einführen. Daher ist ein ausgewogener Ansatz der Schlüssel - Verwendung :is() es sei denn, Sie benötigen die genaue Spezifitätskontrolle von :where() .

Das obige ist der detaillierte Inhalt von: Wo () hat auch einen coolen Spezifitätstrick.. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!