Neu in Chrome 142

Rachel Andrew

Veröffentlicht: 28. Oktober 2025

Chrome 142 wird gerade eingeführt. In diesem Beitrag werden einige der wichtigsten Funktionen der Version vorgestellt. Vollständige Versionshinweise zu Chrome 142

Highlights dieser Version:

Pseudoklassen :target-before und :target-after

Diese Pseudoklassen entsprechen Scrollmarkierungen, die sich in derselben Scrollmarkierungsgruppe vor oder nach der aktiven Markierung (entspricht :target-current) befinden, wie durch die Reihenfolge im flachen Baum bestimmt:

  • :target-before: Entspricht allen Scrollmarkierungen, die in der Reihenfolge des flachen Baums innerhalb der Gruppe vor der aktiven Markierung stehen.
  • :target-after: Entspricht allen Scrollmarkierungen, die in der Gruppe in der Reihenfolge des flachen Baums auf die aktive Markierung folgen.

Bereichssyntax für Stilcontainerabfragen und if()

Chrome erweitert CSS-Stilabfragen und die if()-Funktion durch die Unterstützung der Bereichssyntax.

Damit können Stilabfragen über den genauen Wertabgleich hinaus erweitert werden (z. B. style(--theme: dark)). Entwickler können Vergleichsoperatoren wie > und < verwenden, um benutzerdefinierte Eigenschaften, Literalwerte (z. B. 10 px oder 25%) und Werte aus Ersetzungsfunktionen wie attr() und env() zu vergleichen. Für einen gültigen Vergleich müssen beide Seiten denselben Datentyp ergeben. Sie ist auf die folgenden numerischen Typen beschränkt: <length>, <number>, <percentage>, <angle>, <time>, <frequency> und <resolution>.

Beispiele:

Vergleichen Sie eine benutzerdefinierte Eigenschaft mit einer literalen Länge:

@container style(--inner-padding > 1em) {
  .card {
    border: 2px solid;
  }
}

Zwei Literalwerte vergleichen

@container style(1em < 20px) {
  /* ... */
}

Stilbereiche in if() verwenden:

.item-grid {
  background-color: if(style(attr(data-columns, type<number>) > 2): lightblue; else: white);
}

Aufrufer für Interessen (das Attribut interestfor)

Chrome fügt den interestfor-Attributen <button> und <a> ein interestfor-Attribut hinzu. Mit diesem Attribut werden dem Element „Interesse“-Verhaltensweisen hinzugefügt. Wenn ein Nutzer Interesse zeigt, werden Aktionen für das Zielelement ausgelöst, z. B. das Einblenden eines Popovers.

Der User-Agent erkennt, wenn ein Nutzer Interesse an dem Element zeigt, z. B. indem er den Mauszeiger darauf bewegt, bestimmte Tastenkombinationen auf der Tastatur drückt oder das Element auf Touchscreens lange drückt. Wenn Interesse gezeigt oder verloren wird, wird ein InterestEvent für das Ziel ausgelöst, das Standardaktionen für Pop-overs hat, z. B. das Ein- und Ausblenden des Pop-overs.

Weitere Informationen

Hier werden nur einige wichtige Highlights behandelt. Unter den folgenden Links finden Sie weitere Änderungen in Chrome 141.

Abonnieren

Wenn Sie auf dem Laufenden bleiben möchten, abonnieren Sie den YouTube-Kanal Chrome Developers. Sie erhalten dann eine E-Mail-Benachrichtigung, wenn wir ein neues Video veröffentlichen. Oder folgen Sie uns auf X oder LinkedIn, um neue Artikel und Blogposts zu erhalten.

Sobald Chrome 143 veröffentlicht wird, informieren wir Sie hier über die Neuerungen in Chrome.