Nowości na platformie internetowej w listopadzie

Poznaj kilka interesujących funkcji, które trafiły do przeglądarek w stabilnej i wersji beta w listopadzie 2022 r.

Rachel Andrew

stabilne wersje przeglądarek,

W listopadzie wersje Firefox 107 i Chrome 108 stały się stabilne. Zobaczmy, co to oznacza dla platformy internetowej.

Zmiana zachowania widocznego obszaru w układzie w Chrome na Androidzie

W Chrome 108 na Androidzie zmieniono sposób działania układu Viewport, gdy wyświetlana jest klawiatura ekranowa. Więcej informacji znajdziesz w artykule Przygotowanie do zmian w działaniu dotyczącym zmiany rozmiaru widocznego obszaru w Chrome na Androida.

Nowe jednostki widocznego obszaru

Chrome 108 zawiera też nowe jednostki Viewport w CSS. Obejmuje 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 jednostki są już zaimplementowane w Firefox i Safari, co oznacza, że teraz te jednostki są obsługiwane w ramach interoperacyjności w trzech głównych silnikach przeglądarek.

Przeczytaj artykuł Duże, małe i dynamiczne widoczne obszary.

Właściwość CSS contain-intrinsic-size jest obsługiwana w Firefox 107, podobnie jak pełna nazwa contain-intrinsic-width, contain-intrinsic-height i właściwości logiczne contain-intrinsic-block-size oraz contain-intrinsic-inline-size.

Są one używane do określania rozmiaru elementu interfejsu użytkownika, który podlega ograniczeniu 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 podlega ograniczeniu rozmiaru.

Obsługa słowa kluczowego CSS fragmentation avoid

Wersja Chrome 108 obsługuje wartość avoid właściwości fragmentacji CSS break-before, break-after i break-inside podczas drukowania. Ta wartość informuje przeglądarkę, aby nie uszkodziła elementu przed, po ani wewnątrz elementu, do którego został zastosowany. Na przykład poniższy kod CSS zapobiega dzieleniu się rysunku na części w miejscu podziału strony.

figure {
    break-inside: avoid;
}

Dodatek ten jest spowodowany dodaniem obsługi drukowania za pomocą LayoutNG, co zapewnia nowoczesne, mniej problematyczne działanie. Więcej informacji o LayoutNG

Interfejs Federated Credential Management API

Interfejs Federated Credential Management API (FedCM) zapewnia abstrakcję dla przepływów tożsamości w federacji w internecie. Wyświetla okno dialogowe w przeglądarce, które umożliwia użytkownikom wybranie kont dostawców tożsamości do logowania się w witrynach. FedCM jest dostępny w Chrome 108. Więcej informacji znajdziesz w poście na blogu z ogłoszeniem FedCM.

Wersje beta przeglądarek

Przeglądarki w wersji beta dają podgląd funkcji, które zostaną wprowadzone w następnej stabilnej wersji przeglądarki. 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. Ze względu na daty premier jedyną nową wersją beta w tym miesiącu jest Firefox 108, a Safari 16.2 beta nadal jest w trakcie.

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

Trwa wdrażanie zapytań dotyczących kontenerów w przeglądarce Firefox. Za flagą layout.css.container-queries.enabled w przeglądarce Firefox 108 w wersji beta znajdują się jednostki długości zapytania kontenera – cqw, cqh, cqi, cqb, cqmin, cqmax. Są to jednostki długości w stosunku do rozmiaru kontenera zapytania.

Cześć cyklu Nowości w internecie