Nowości na platformie internetowej w marcu

Poznaj kilka ciekawych funkcji, które w marcu 2022 r. pojawiły się w stabilnych i beta wersjach przeglądarek.

Rachel Andrew

Wersje stabilne przeglądarki

W marcu stały się one stabilnymi wersjami: Chrome 99, Chrome 100, Firefox 98 i Safari 15.4. Wprowadziliśmy na platformie całą serię nowych funkcji, z których wiele sprawiło, że funkcja stała się dostępna we wszystkich 3 platformach przeglądarek. W tym poście skupiliśmy się na ulepszeniach, które zapewniają nam interoperacyjność między przeglądarkami, ale warto zapoznać się z informacjami o wersji, aby poznać wszystkie funkcje dodane do poszczególnych silników.

Chrome 99 i Safari 15.4 zawierały warstwy kaskadowe. At-rule @layer definiuje warstwę kaskadową, która pomaga kontrolować szczegółowość. Dołączają one do Firefoxa, dzięki czemu warstwy kaskadowe są teraz dostępne we wszystkich trzech silnikach przeglądarek. Więcej informacji o warstwach kaskadowych znajdziesz w artykule Warstwy kaskadowe wchodzą do przeglądarki.

Obsługa przeglądarek

  • Chrome: 99.
  • Edge: 99.
  • Firefox: 97.
  • Safari: 15.4

Źródło

Chrome 100 zawiera nową wartość plus-lighter dla właściwości CSS mix-blend-mode. Ta wartość jest przydatna podczas tworzenia efektu przejścia między 2 elementami, gdy wszystkie piksele lub ich podzbiór mają te same wartości. Więcej informacji o rozwiązaniu tego problemu znajdziesz w artykule [Chrome DevTools] Przechodzenie między elementami DOM jest obecnie niemożliwe.

Obsługa przeglądarek

  • Chrome: 100.
  • Edge: 100.
  • Firefox: 99.
  • Safari: 9.1.

Safari 15.4 zawiera właściwość contain, która umożliwia ograniczenie CSS.

Obsługa przeglądarek

  • Chrome: 52.
  • Krawędź: 79.
  • Firefox: 69.
  • Safari: 15.4.

Źródło

Poza tym w Safari w wersji 15.4 jest to accent-color – ta opcja zapewnia kontrolę nad kolorem uzupełniającym używanym w niektórych elementach sterujących formularza.

Obsługa przeglądarek

  • Chrome: 93.
  • Edge: 93.
  • Firefox: 92.
  • Safari: 15.4.

Źródło

W Firefoksie 98 i Safari 15.4 pojawił się element <dialog>, który reprezentuje okno dialogowe.

Obsługa przeglądarek

  • Chrome: 37.
  • Edge: 79.
  • Firefox: 98.
  • Safari: 15.4.

Źródło

Safari 15.4 obsługuje też pseudoklasę :focus-visible. Prace nad implementacją wykonała Igalia.

Obsługa przeglądarek

  • Chrome: 86.
  • Edge: 86.
  • Firefox: 85.
  • Safari: 15.4

Źródło

Wersje beta przeglądarek

Wersje beta przeglądarki umożliwiają przeglądanie funkcji, które pojawią się w następnej wersji stabilnej. To świetny czas na przetestowanie nowych funkcji lub usunięcia, które mogą wpłynąć na Twoją witrynę, zanim zostaną wprowadzone na całym świecie.

W marcu pojawiły się nowe wersje beta Chrome 101 i Firefox 99.

Wersja beta Chrome 101 zawiera notację kolorów hwb. Określa kolor na podstawie jego odcienia, bieli i czerni. Tak jak w przypadku innego zapisu kolorów, opcjonalny komponent alfa określa przezroczystość.

h1 {
  color: hwb(194 0% 0% / .5) /* #00c3ff with 50% opacity */
}

Obsługa przeglądarek

  • Chrome: 101.
  • Edge: 101.
  • Firefox: 96.
  • Safari: 15.

Źródło

Firefox 99 zawiera właściwość pdfViewerEnabled interfejsu Navigator. Ta właściwość wskazuje, czy przeglądarka obsługuje wyświetlanie plików PDF w tekście.

if (!navigator.pdfViewerEnabled) {
  // The browser does not support inline viewing of PDF files.
}

Obsługa przeglądarek

  • Chrome: 94.
  • Edge: 94.
  • Firefox: 99.
  • Safari: 16.4.

Źródło

Te funkcje beta wkrótce trafią do stabilnych wersji przeglądarek.

Część serialu „Nowości w internecie”