Entdecke einige der interessanten Funktionen, die im März 2023 in den stabilen und Beta-Webbrowsern eingeführt wurden.
Stabile Browserversionen
Seit März 2023 sind Firefox 111, Chrome 111 und Safari 16.4 stabil. Sehen wir uns einmal an, was das für die Webplattform bedeutet.
Globale HTML-Attribute
In Firefox 111 werden einige nützliche globale HTML-Attribute unterstützt. Mit dem Attribut autocapitalize wird festgelegt, ob Text automatisch großgeschrieben werden kann, wenn der Nutzer auf einer Bildschirmtastatur etwas eintippt.
Das translate-Attribut gibt an, ob ein Element übersetzt werden soll, wenn eine Seite lokalisiert wird.
Origin Private File System (OPFS)
Firefox unterstützt das Origin Private File System (OPFS), wenn die File System Access API verwendet wird. Weitere Informationen zum OPFS
View Transitions API
In Chrome 111 wird die View Transitions API hinzugefügt. Damit wird das Erstellen ausgefeilter Übergänge in Single-Page-Apps (SPAs) einfacher, da Ansichten erstellt werden und sich das DOM ohne Überschneidung der Status ändern kann.
Neue CSS-Farbräume und -Funktionen
In Chrome 111 gibt es außerdem eine ganz neue Reihe von Möglichkeiten zur Verwendung von Farben im Web. Chrome unterstützt jetzt neben den Funktionen color() und color-mix() jetzt Farbräume, in denen auf Farben außerhalb des RGB-Farbraums zugegriffen wird. Weitere Informationen finden Sie in unserem High Definition CSS-Farbleitfaden und im Blogpost zu color-mix().
Die Chrome-Version enthält außerdem neue Entwicklertools, die Ihnen die Arbeit mit dieser neuen Farbfunktion erleichtern.
Mehr Kontrolle über die Auswahl von :nth-child()
In Chrome 111 kann jetzt eine Auswahlliste an :nth-child() und nth-last-child() übergeben werden. Weitere Informationen sowie Beispiele finden Sie im Beitrag Mehr Kontrolle über die Auswahl von „:nth-child()“ mit der Syntax von S.
Unterstützte Browser
- 111
- 111
- 113
- 9
Unterstützung der vorherigen und nächsten Folie in der Media Session API
In dieser Liste der Chrome 111-Ergänzungen finden Sie auch die Aktionen für Präsentationen für die Media Session API: "previousslide" und "nextslide".
Unterstützte Browser
- 111
- 111
- x
- x
Unterstützung von Pseudoklassen in Safari
Safari 16.4 ist eine hervorragende Version für die Webplattform. In diesem Artikel werden nicht alle Ergänzungen behandelt. Eine vollständige Liste der Funktionen finden Sie in den Versionshinweisen zu Safari 16.4.
In dieser Version gibt es eine Reihe zusätzlicher CSS-Pseudoklassen, die unterstützt werden: :user-invalid, :user-valid, :dir(), :modal und :fullscreen.
Neue Bereichssyntax für Medienabfragen
Diese Safari-Version macht die weitaus elegantere und nützlichere Bereichssyntax für Medienabfragen über alle drei Suchmaschinen interoperabel. Beispiele für diese Syntax findest du in diesem Beitrag, der seit der Einführung der Syntax in Chrome veröffentlicht wurde.
CSS-Eigenschaften und -Werte
Safari 16.4 unterstützt jetzt @property und ermöglicht die Registrierung benutzerdefinierter CSS-Eigenschaften direkt über ein Stylesheet. Weitere Informationen dazu finden Sie unter @property: CSS-Variablen mit Superpowers.
Unterstützung der CSS API
Die tollen Ergänzungen für CSS werden laufend ergänzt, einschließlich der Unterstützung für CSS Typed OM. Diese API stellt CSS-Werte als typisierte JavaScript-Objekte und nicht als Strings bereit. Sie erleichtert die Arbeit mit CSS über JavaScript und ist leistungsfähiger als vorhandene Methoden.
Außerdem werden konstruierbare Stylesheets mit CSSStyleSheet() unterstützt. Dies ermöglicht die gemeinsame Nutzung von Stylesheets zwischen einem Dokument und seinen Schatten-DOM-Unterstrukturen. Mit dieser Version von Safari werden konstruierbare Stylesheets jetzt in allen drei Suchmaschinen unterstützt.
Web Push und Badging API
Safari unterstützt jetzt neben der Badging API auch Web Push, was für App-Entwickler sehr gute Nachrichten ist. Mit dieser Version werden insbesondere Push-Benachrichtigungen von allen wichtigen Suchmaschinen unterstützt.
Karten importieren
Eine weitere Neuerung, die den interoperablen Status einer Funktion verleiht, sind die Importkarten von JavaScript, die das Importieren von ES-Modulen vereinfachen.
Unterstützte Browser
- 89
- 89
- 108
- 16.4
Beta-Browser-Releases
Beta-Browser-Versionen bieten eine Vorschau auf Elemente in der nächsten stabilen Version des Browsers. Dies ist ein guter Zeitpunkt, um neue Funktionen zu testen oder die Entfernung von Inhalten zu testen, die sich auf Ihre Website auswirken könnten, bevor die Veröffentlichung weltweit verfügbar ist. Die neuen Betaversionen sind Firefox 112, Safari 16.5 und Chrome 112. Diese Releases bieten viele tolle Funktionen auf der Plattform. Weitere Einzelheiten finden Sie in den Versionshinweisen. Hier sind nur ein paar Highlights.
In Firefox 112 wird jetzt das Attribut inert unterstützt, wodurch dieses nützliche Attribut in allen Suchmaschinen verfügbar ist. Weitere Informationen zur Funktion „Inert“ finden Sie unter Einführung in „inert“. In Firefox wird auch die Unterstützung für die Easing-Funktion linear() aktiviert.
In Chrome 112 und Safari 16.5 wird CSS Nesting unterstützt. Diese Funktion wird von vielen Entwicklern mit Spannung erwartet.
Chrome 112 unterstützt auch animation-composition. Weitere Informationen zu dieser Eigenschaft finden Sie unter Festlegen, wie mehrere Animationseffekte mit der Animationszusammensetzung zusammengesetzt werden sollen.
Wenn Sie den Headless-Modus von Chrome verwenden, z. B. mit Puppeteer, bietet 112 einen komplett neuen Headless-Modus. Weitere Informationen
Teil der Reihe zum Thema „Neu im Web“