Nowości w Chrome 142

Rachel Andrew

Data publikacji: 28 października 2025 r.

Wersja Chrome 142 jest obecnie wdrażana. W tym poście znajdziesz informacje o niektórych najważniejszych funkcjach tej wersji. Przeczytaj pełne informacje o wersji Chrome 142.

Najważniejsze zmiany w tej wersji:

Pseudoklasy :target-before i :target-after

Te pseudoklasy pasują do znaczników przewijania, które znajdują się przed lub za aktywnym znacznikiem (pasującym do :target-current) w tej samej grupie znaczników przewijania, zgodnie z kolejnością w płaskim drzewie:

  • :target-before: pasuje do wszystkich znaczników przewijania, które poprzedzają aktywny znacznik w płaskiej kolejności drzewa w grupie.
  • :target-after: pasuje do wszystkich znaczników przewijania, które znajdują się za aktywnym znacznikiem w płaskiej strukturze drzewa w grupie.

Składnia zakresu w przypadku zapytań dotyczących kontenerów stylów i funkcji if()

Chrome ulepsza zapytania o style CSS i funkcję if(), dodając obsługę składni zakresu.

Rozszerza zapytania o style poza dopasowywanie dokładnych wartości (np. style(--theme: dark)). Deweloperzy mogą używać operatorów porównania (np. > i <) do porównywania właściwości niestandardowych, wartości literałów (np. 10 pikseli lub 25%) i wartości z funkcji zastępowania, takich jak attr() i env(). Aby porównanie było prawidłowe, obie strony muszą mieć ten sam typ danych. Jest on ograniczony do tych typów liczbowych: <length>, <number>, <percentage>, <angle>, <time>, <frequency> i <resolution>.

Przykłady:

Porównaj właściwość niestandardową z długością literału:

@container style(--inner-padding > 1em) {
  .card {
    border: 2px solid;
  }
}

Porównywanie dwóch wartości dosłownych

@container style(1em < 20px) {
  /* ... */
}

Korzystanie z zakresów stylów w if():

.item-grid {
  background-color: if(style(attr(data-columns, type<number>) > 2): lightblue; else: white);
}

Wywołujący zainteresowania (atrybut interestfor)

Chrome dodaje atrybut interestfor do elementów <button> i <a>. Ten atrybut dodaje do elementu zachowania związane z „zainteresowaniem”. Gdy użytkownik wykazuje zainteresowanie elementem, w elemencie docelowym są wywoływane działania, np. wyświetlanie wyskakującego okienka.

Klient użytkownika wykrywa, kiedy użytkownik wykazuje zainteresowanie elementem, np. przez przytrzymanie wskaźnika nad elementem, naciśnięcie specjalnych klawiszy skrótu na klawiaturze lub długie naciśnięcie elementu na ekranie dotykowym. Gdy użytkownik wykazuje zainteresowanie lub je traci, w elemencie docelowym uruchamia się zdarzenie InterestEvent, które ma domyślne działania w przypadku wyskakujących okien, takie jak wyświetlanie i ukrywanie wyskakującego okna.

Więcej informacji

Obejmuje to tylko niektóre najważniejsze informacje. Więcej informacji o dodatkowych zmianach w Chrome 141 znajdziesz w tych artykułach:

Subskrybuj

Aby być na bieżąco, zasubskrybuj kanał Chrome Developers w YouTube. Będziesz otrzymywać powiadomienia e-mail o nowych filmach. Możesz też obserwować nas na X lub LinkedIn, aby otrzymywać powiadomienia o nowych artykułach i postach na blogu.

Gdy tylko Chrome 143 zostanie udostępniony, poinformujemy Cię o nowościach w Chrome.