Nowości na platformie internetowej w listopadzie

Odkryj ciekawe funkcje, które zostały udostępnione w wersjach stabilnych i beta w przeglądarkach internetowych w listopadzie 2022 roku.

Stabilne wersje przeglądarek

W listopadzie przeglądarki Firefox 107 i Chrome 108 stały się stabilne. Przyjrzyjmy się, co to oznacza dla platformy internetowej.

Zmiana działania widocznego obszaru układu w Chrome na urządzeniach z Androidem

W Chrome 108 na Androidzie, gdy wyświetlana jest klawiatura ekranowa, wprowadzono zmianę w sposobie działania widocznego obszaru układu. Więcej informacji znajdziesz w artykule Przygotowanie do zmian zmiany rozmiaru widocznego obszaru, które wprowadzimy w Chrome na urządzeniach z Androidem.

Nowe jednostki widocznego obszaru

W Chrome 108 pojawiły się też nowe jednostki widocznego obszaru CSS. Są to małe (svw, svh, svi, svb, svmin, svmax), duże (lvw, lvh, lvi, lvb, lvmin, lvmax), dynamiczne (dvw, dvh, dvi, dvb, dvmin, dvmax) i logiczne (vi, vb). Jednostki te są już zaimplementowane w przeglądarkach Firefox i Safari, co oznacza, że możemy w ich przypadku współpracować z 3 głównymi silnikami przeglądarek.

Przeczytaj artykuł Duże, małe i dynamiczne jednostki widocznego obszaru.

Obsługa przeglądarek

  • 108
  • 108
  • 101
  • 15,4

Skrócona właściwość CSS contain-intrinsic-size jest obsługiwana w Firefoksie w wersji 107 razem z długofalowymi contain-intrinsic-width, contain-intrinsic-height oraz właściwościami logicznymi contain-intrinsic-block-size i contain-intrinsic-inline-size.

Są one stosowane, aby określić rozmiar elementu interfejsu, który podlega ograniczeniom rozmiaru. Dzięki temu klient użytkownika może określić rozmiar elementu bez konieczności renderowania jego elementów podrzędnych. Są one przydatne, gdy element jest objęty ograniczeniem rozmiaru.

Obsługa przeglądarek

  • 83
  • 83
  • 107
  • 17

Źródło

Obsługa słowa kluczowego avoid służącego do fragmentacji CSS

Chrome 108 obsługuje podczas drukowania wartość avoid właściwości podziału CSS break-before, break-after i break-inside. Ta wartość informuje przeglądarkę, że ma ona uniknąć uszkodzenia przed elementem, do którego jest stosowana, po nim lub wewnątrz niego. Poniższy kod CSS pozwala na przykład uniknąć uszkodzenia grafiki w podziałie strony.

figure {
    break-inside: avoid;
}

Wprowadzenie obsługi drukowania w narzędziu LayoutNG sprawia, że interfejs jest nowoczesny i łatwiejszy w obsłudze. Więcej informacji o komponencie LayoutNG

Interfejs API sfederowanego zarządzania danymi uwierzytelniającymi

Interfejs Federated Credential Management API (FedCM) zapewnia abstrakcję dla sfederowanych przepływów tożsamości w sieci. Udostępnia okno zapośredniczone w przeglądarce, które umożliwia użytkownikom wybranie kont z identyfikacji dostawców, aby zalogować się w witrynach. FedCM wysyła zamówienia na Chrome 108. Więcej informacji na ten temat znajdziesz w poście na blogu z ogłoszeniem na temat FedCM.

Wersje przeglądarki (beta)

Wersje beta zawierają podgląd funkcji, które pojawią się w następnej stabilnej wersji przeglądarki. To doskonała okazja do przetestowania nowych funkcji lub usunięć, które mogą wpłynąć na Twoją witrynę, zanim udostępnimy je użytkownikom na całym świecie. Ze względu na zakres dat premiery jedyną nową wersją beta w tym miesiącu będzie Firefox 108. Safari 16.2 w wersji beta wciąż trwa.

Firefox 108 obsługuje atrybuty height i width elementu <source>, jeśli jest elementem podrzędnym elementu <picture>. Te atrybuty akceptują wysokość lub szerokość obrazu w pikselach jako liczbę całkowitą bez jednostki.

Trwa implementacja zapytań dotyczących kontenerów w przeglądarce Firefox. Pod flagą layout.css.container-queries.enabled w przeglądarce Firefox w wersji beta 108 znajduje się jednostka długości zapytania kontenera: cqw, cqh, cqi, cqb, cqmin, cqmax. Są to jednostki długości względem rozmiaru kontenera zapytań.

Część serii nowości w internecie