Tính năng mới trong Chrome 142

Rachel Andrew

Ngày xuất bản: 28 tháng 10 năm 2025

Chrome 142 hiện đang được triển khai và bài đăng này chia sẻ một số tính năng chính trong bản phát hành. Đọc toàn bộ ghi chú phát hành Chrome 142.

Điểm nổi bật trong bản phát hành này:

Các lớp giả :target-before và :target-after

Các lớp giả này khớp với các điểm đánh dấu cuộn nằm trước hoặc sau điểm đánh dấu đang hoạt động (khớp với :target-current) trong cùng một nhóm điểm đánh dấu cuộn, theo thứ tự cây phẳng:

  • :target-before: So khớp tất cả các điểm đánh dấu cuộn đứng trước điểm đánh dấu đang hoạt động theo thứ tự cây phẳng trong nhóm.
  • :target-after: So khớp tất cả các điểm đánh dấu cuộn theo điểm đánh dấu đang hoạt động theo thứ tự cây phẳng trong nhóm.

Cú pháp phạm vi cho truy vấn vùng chứa kiểu và if()

Chrome cải thiện các truy vấn kiểu CSS và hàm if() bằng cách thêm tính năng hỗ trợ cú pháp phạm vi.

Tính năng này mở rộng các truy vấn kiểu ngoài việc so khớp giá trị chính xác (ví dụ: style(--theme: dark)). Nhà phát triển có thể sử dụng các toán tử so sánh (chẳng hạn như > và <) để so sánh các thuộc tính tuỳ chỉnh, giá trị cố định (ví dụ: 10px hoặc 25%) và các giá trị từ các hàm thay thế như attr() và env(). Để so sánh hợp lệ, cả hai bên phải phân giải thành cùng một kiểu dữ liệu. Loại này chỉ giới hạn ở các kiểu số sau: <length>, <number>, <percentage>, <angle>, <time>, <frequency> và <resolution>.

Ví dụ:

So sánh một thuộc tính tuỳ chỉnh với độ dài cố định:

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

So sánh hai giá trị cố định

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

Sử dụng dải ô kiểu trong if():

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

Công cụ kích hoạt mối quan tâm (thuộc tính interestfor)

Chrome thêm một thuộc tính interestfor vào các phần tử <button> và <a>. Thuộc tính này thêm các hành vi "quan tâm" vào phần tử. Khi người dùng thể hiện sự quan tâm đến phần tử, các thao tác sẽ được kích hoạt trên phần tử đích, chẳng hạn như hiển thị một cửa sổ bật lên.

Tác nhân người dùng phát hiện thời điểm người dùng thể hiện sự quan tâm đến phần tử thông qua các phương thức như giữ con trỏ trên phần tử, nhấn các phím nóng đặc biệt trên bàn phím hoặc nhấn và giữ phần tử trên màn hình cảm ứng. Khi người dùng thể hiện sự quan tâm hoặc không còn quan tâm, một InterestEvent sẽ kích hoạt trên mục tiêu, mục tiêu này có các thao tác mặc định cho cửa sổ bật lên, chẳng hạn như hiện và ẩn cửa sổ bật lên.

Tài liệu đọc thêm

Đây chỉ là một số điểm nổi bật chính. Hãy xem các đường liên kết sau để biết thêm các thay đổi trong Chrome 141.

Đăng ký

Để luôn nắm bắt thông tin mới nhất, hãy đăng ký theo dõi kênh YouTube của Chrome Developers. Bạn sẽ nhận được thông báo qua email mỗi khi chúng tôi ra mắt video mới. Hoặc theo dõi chúng tôi trên X hoặc LinkedIn để xem các bài viết và bài đăng mới trên blog.

Ngay khi Chrome 143 được phát hành, chúng tôi sẽ thông báo cho bạn về những điểm mới trong Chrome!