Neue CSS-Farbtypen und -Farbräume, trigonometrische CSS-Funktionen und die View Transitions API.
Sofern nicht anders angegeben, gelten die folgenden Änderungen für die neueste Chrome-Betaversion für Android, ChromeOS, Linux, macOS und Windows. Weitere Informationen zu den hier aufgeführten Funktionen finden Sie über die bereitgestellten Links oder in der Liste auf ChromeStatus.com. Chrome 111 ist seit dem 9. Februar 2023 als Betaversion verfügbar. Die neuesten Versionen stehen unter Google.com für Computer und im Google Play Store für Android-Geräte zum Download bereit.
CSS
Neue CSS-Farbtypen und -Bereiche
Alle unter CSS-Farbstufe 4 beschriebenen Funktionen sind jetzt aktiviert. Dazu gehören vier geräteunabhängige Farbtypen (lab, Oklab, lch und Oklch), die Funktion color()
und benutzerdefinierte Farbräume für Farbverläufe und Animationen.
Weitere Informationen zu diesen neuen Farbtypen und Räumen finden Sie im Leitfaden zu CSS-Farben in High Definition.
Die color-mix()
-Funktion
Auch die unglaublich nützliche color-mix()
-Funktion von CSS Color 5 ist verfügbar. Diese Funktion ermöglicht das Mischen eines Prozentsatzes einer Farbe in eine andere in einem unterstützten Farbraum. Im folgenden Beispiel werden 10% von blue
in SRGB zu white
gemischt.
.item {
background-color: color-mix(in srgb, blue 10%, white);
}
CSS-Selektoren 4 Pseudoklasse :nth-child(an + b of S)
Erweitert :nth-child(an + b)
und :nth-last-child()
, um einen Selektor zu übernehmen. Beispiel: :nth-child(3 of .c)
ist der dritte .c
unter einem bestimmten übergeordneten Element. Weitere Informationen finden Sie im Beitrag Mehr Kontrolle über die :nth-child()
-Auswahl mit der of S
-Syntax.
CSS-Stammschrifteinheiten
Fügt der vorhandenen Stamm-Schrifteinheit von rem
die Stamm-Schrifteinheiten hinzu: rex
, rch
, ric
und rlh
.
Trigonometrische CSS-Funktionen
Die trigonometrischen Funktionen sin()
, cos()
, tan()
, asin()
, acos()
, atan()
und atan2()
wurden mathematischen Ausdrücken von CSS hinzugefügt.
Containerabfragen für benutzerdefinierte CSS-Eigenschaften gestalten
Fügt die style()
-Funktion zu @container
-Regeln hinzu, damit Stile basierend auf den berechneten Werten benutzerdefinierter Eigenschaften eines Ancestor-Elements angewendet werden können.
Das Attribut baseline-source
Mit der Eigenschaft baseline-source
können Webentwickler angeben, ob ein Feld auf Inline-Ebene die Referenz first
oder last
für die Ausrichtung innerhalb eines Linienfelds verwenden soll.
Web APIs
Der Berechtigungs- und Berechtigungsrichtlinienstring window-management
In Chrome 111 wird window-management
als Alias für window-placement
-Berechtigungs- und Berechtigungsrichtlinienstrings hinzugefügt. Dies ist Teil einer größeren Bemühung, die Strings umzubenennen, indem window-placement
schließlich verworfen und entfernt wird. Durch die Änderung der Terminologie wird die Langlebigkeit des Deskriptors verbessert, da sich die Window Management API im Laufe der Zeit weiterentwickelt.
Media Session API: Aktionen für das Präsentieren von Folien
Fügt der vorhandenen Media Session API die Aktionen previousslide
und nextslide
hinzu.
ArrayBuffer
mit anpassbarer Größe und erweiterbar SharedArrayBuffer
Erweitern Sie die ArrayBuffer
-Konstruktoren auf eine zusätzliche maximale Länge, die ein direktes Wachstum und Verkleinerung von Puffern ermöglicht. In ähnlicher Weise wird SharedArrayBuffer
um eine zusätzliche maximale Länge erweitert, die direktes Wachstum ermöglicht.
Spekulationsregeln: Richtlinienschlüssel für Referrer-URL
Dadurch wird die Syntax der Spekulationsregeln erweitert, sodass Entwickler die Referrer-URL-Richtlinie angeben können, die bei spekulativen Anfragen verwendet werden soll, die von Spekulationsregeln ausgelöst werden. Außerdem wird die „Ausreichend strikte Referrer-URL-Richtlinie“ wieder eingeführt. Anforderung.
Deklaratives Shadow DOM für Streaming
Dadurch wird Streaming unterstützt, da der Schattenstamm an das öffnende und nicht an das schließende Vorlagen-Tag angehängt wird.
Transitions API ansehen
Ermöglicht die Erstellung von polierten Übergängen in Single-Page-Anwendungen (SPAs), indem Ansichten über Snapshots erstellt werden und das DOM ohne Überschneidungen zwischen den Status geändert werden kann. Mit „Übergänge ansehen“ können Sie benutzerdefinierte Übergänge erstellen oder eine einfache Standardüberblendung verwenden, um die Nutzerfreundlichkeit zu verbessern.
Im Artikel für Chrome-Entwickler finden Sie weitere Informationen und Beispiele für Umstellungen, die Ihnen den Einstieg erleichtern.
Skalierbare Erweiterungen für WebRTC-Videocodierung
Diese Erweiterung definiert eine Standardmethode zur Auswahl zwischen möglichen Konfigurationen für skalierbare Videocodierung (SVC) in einem ausgehenden WebRTC-Videotrack.
WebXR-Attribut enabledFeatures
Gibt die Funktionen zurück, die gemäß XRSessionInit
für diesen XRSession
aktiviert wurden, sowie die impliziten Features, die von der Spezifikation für den angegebenen Modus und die angegebenen Funktionen erforderlich sind. Bei einer gewährten Sitzung enthält dies alle requiredFeatures
, kann aber eine Teilmenge von optionalFeatures
sein. Bei den meisten Funktionen kann auf alternative Weise festgestellt werden, ob sie gewährt wurden. Bei einigen Funktionen kann die Angabe, ob eine Funktion aktiviert ist, eng mit Daten für eine Funktion zusammenhängen, die im Moment nicht verfügbar sind. Durch die Abfrage von enabledFeatures
lässt sich ermitteln, ob hilfreiche Hinweise (z. B. zum Verbessern oder Starten des Trackings) angezeigt werden sollen oder ob eine Funktion in der aktuellen Sitzung nie unterstützt wird.
Ursprungstests laufen
In Chrome 111 können Sie die folgenden neuen Ursprungstests aktivieren.
Test zur Einstellung für die Entfernung der CSP-Umgehung „connect-src
“ in der Web Payment API
Die Web Payment API kann die CSP-Richtlinie „connect-src“ beim Abrufen des Manifests nicht mehr umgehen. Nach dieser Einstellung muss die CSP-Richtlinie „connect-src“ einer Website die URL der Zahlungsmethode, die in einem PaymentRequest-Aufruf angegeben wird, sowie alle anderen URLs zulassen, die die Methodenkette zum Abrufen des Manifests anfordert.
Diese Umgehungsfunktion wird in Chrome 111 mit einem umgekehrten Ursprungstest von 111 bis 113 für Entwickler entfernt, die die Umgehung vorübergehend wieder aktivieren müssen. Wenn Sie sich dafür anmelden möchten, registrieren Sie sich für den umgekehrten Einstellungstest für die CSP-Umgehung connect-src
.
Bild im Bild dokumentieren
Die Document Picture-in-Picture API ist eine neue API, mit der Sie ein Always-on-Top-Fenster öffnen können, das mit beliebigen HTML-Inhalten gefüllt werden kann. Dies ist eine Erweiterung der bestehenden Picture-in-Picture-API, mit der nur ein HTMLVideoElement in ein BiB-Fenster eingefügt werden kann. So können Webentwickler den Nutzern ein besseres BiB-Erlebnis bieten.
Weitere Informationen finden Sie in der Dokumentation zu „Bild im Bild“-Dokument.
Registrieren Sie sich für den Ursprungstest von „Document Picture-In-Picture“.
Einstellung und Entfernung
Mit dieser Version von Chrome werden die unten aufgeführten Einstellungen und Entfernungen eingeführt. Unter ChromeStatus.com finden Sie eine Liste mit geplanten Einstellungen, aktuellen Einstellungen und früheren Löschungen.
In dieser Version von Chrome werden drei Funktionen entfernt.
Zahlungsmittel entfernen
PaymentInstruments ist die Web-API, die die Nicht-JIT-Installation von Zahlungs-Apps unterstützt (siehe https://w3c.github.io/payment-handler/). Bei der Entwicklung wurde davon ausgegangen, dass im Browser die eigentlichen Details des Zahlungsmittels gespeichert werden. Dies hat sich jedoch nicht als wahr herausgestellt und es bestehen Datenschutzlecks. Sie wurde auch in keinem anderen Browser ausgeliefert und wir haben kein Interesse von anderen Browser-Anbietern festgestellt. Daher wurde diese API eingestellt und entfernt.
CSP-Umgehung für connect-src
in der Web Payment API entfernen
Die Web Payment API kann die CSP-Richtlinie connect-src
beim Abrufen des Manifests nicht mehr umgehen. Nach diesem Entfernen muss die CSP-Richtlinie connect-src
einer Website die in einem PaymentRequest-Aufruf angegebene URL der Zahlungsmethode sowie alle anderen URLs zulassen, die die Methodenkette zum Abrufen des Manifests verknüpft.
In den Informationen unter Ursprungstests erfahren Sie, wie Sie einen Einstellungstest aktivieren können, um mehr Zeit für die erforderlichen Änderungen aufgrund dieser Entfernung zu haben.
Händleridentität in canmakepayment
-Ereignis
Das Service Worker-Ereignis canmakepayment
teilt dem Händler mit, ob der Nutzer eine Karte in einer installierten Zahlungs-App hinterlegt hat. Damit werden der Ursprung des Händlers und beliebige Daten im Hintergrund von der Zahlungs-App an einen Service Worker übergeben. Diese ursprungsübergreifende Kommunikation erfolgte bei der PaymentRequest-Konstruktion in JavaScript, erforderte keine Nutzergeste und zeigte keine Benutzeroberfläche. Diese Passage für lautlose Daten wurde aus dem canmakepayment
-Ereignis und dem Android-IS_READY_TO_PAY
-Intent entfernt.