Các loại màu và không gian màu CSS mới, hàm lượng giác CSS và API chuyển đổi khung hiển thị.
Trừ phi có ghi chú khác, những thay đổi sau sẽ áp dụng cho bản phát hành kênh thử nghiệm Chrome mới nhất dành cho Android, ChromeOS, Linux, macOS và Windows. Tìm hiểu thêm về các tính năng nêu tại đây thông qua đường liên kết đi kèm hoặc trong danh sách trên ChromeStatus.com. Chrome 111 sẽ là bản beta kể từ ngày 9 tháng 2 năm 2023. Bạn có thể tải phiên bản mới nhất xuống từ Google.com cho máy tính hoặc trên Cửa hàng Google Play trên Android.
CSS
Các loại màu và không gian mới cho CSS
Tất cả tính năng được mô tả trong Màu CSS Cấp 4 hiện đã bật. Mã này bao gồm 4 loại màu độc lập với thiết bị (lab, Oklab, lch và Oklch), hàm color() và các hệ màu do người dùng xác định cho hiệu ứng chuyển màu và ảnh động.
Đọc Hướng dẫn về màu CSS độ phân giải cao để tìm hiểu về các loại màu và không gian mới này.
Hàm color-mix()
Hàm color-mix() vô cùng hữu ích trong CSS Color 5 cũng là chức năng vận chuyển. Hàm này cho phép kết hợp một tỷ lệ phần trăm của một màu này vào một màu khác, trong bất kỳ hệ màu nào được hỗ trợ. Ví dụ sau đây kết hợp 10% của blue vào white trong SRGB.
.item {
background-color: color-mix(in srgb, blue 10%, white);
}
Bộ chọn CSS 4 Loại được gán biệt danh :nth-child(an + b của S)
Mở rộng :nth-child(an + b) và :nth-last-child() để lấy một bộ chọn. Ví dụ: :nth-child(3 of .c) là .c thứ ba dưới một thành phần mẹ nhất định. Để tìm hiểu thêm, hãy đọc bài đăng Kiểm soát tốt hơn các lựa chọn :nth-child() bằng cú pháp of S.
Đơn vị phông chữ gốc CSS
Thêm các đơn vị phông chữ gốc: rex, rch, ric và rlh vào đơn vị phông chữ gốc hiện có của rem.
Hàm lượng giác CSS
Các hàm lượng giác sin(), cos(), tan(), asin(), acos(), atan(), atan2() đã được thêm vào biểu thức toán học CSS.
Truy vấn vùng chứa kiểu cho thuộc tính tuỳ chỉnh CSS
Thêm hàm style() vào các quy tắc @container để có thể áp dụng kiểu dựa trên các giá trị đã tính toán của các thuộc tính tuỳ chỉnh của một phần tử đối tượng cấp trên.
Thuộc tính baseline-source
Thuộc tính baseline-source cho phép nhà phát triển web chỉ định xem một hộp cấp cùng dòng nên sử dụng đường cơ sở first hay last để căn chỉnh trong hộp dòng.
API web
Chuỗi chính sách về quyền và quyền của window-management
Chrome 111 thêm window-management làm biệt hiệu cho các chuỗi chính sách quyền và quyền của window-placement. Đây là một phần trong nỗ lực lớn hơn nhằm đổi tên các chuỗi bằng cách ngừng sử dụng và xoá window-placement. Thay đổi thuật ngữ giúp cải thiện thời gian tồn tại của phần mô tả vì Window Management API phát triển theo thời gian.
Media Session API: Trình bày các thao tác trên trang trình bày
Thêm các hành động previousslide và nextslide vào API Media Session (API Phiên đa phương tiện) hiện có.
ArrayBuffer có thể thay đổi kích thước và SharedArrayBuffer có thể mở rộng
Mở rộng hàm khởi tạo ArrayBuffer để có thêm độ dài tối đa cho phép tăng và thu gọn tại chỗ các vùng đệm. Tương tự, SharedArrayBuffer được mở rộng để có thêm độ dài tối đa cho phép tăng trưởng tại chỗ.
Quy tắc suy đoán: khoá chính sách liên kết giới thiệu
Việc này mở rộng cú pháp của quy tắc suy đoán để cho phép các nhà phát triển chỉ định chính sách giới thiệu để sử dụng với các yêu cầu suy đoán được kích hoạt bởi các quy tắc suy đoán. Nội dung này cũng đưa ra yêu cầu mới về "chính sách liên kết giới thiệu đủ nghiêm ngặt".
DOM bóng khai báo phát trực tuyến
Làm như vậy sẽ hỗ trợ thêm cho việc truyền trực tuyến, bằng cách đính kèm thư mục gốc của bóng đổ vào thẻ mở thay vì thẻ mẫu đóng.
API Chuyển đổi khung hiển thị
Cho phép tạo các chuyển đổi hoàn chỉnh trong Ứng dụng trang đơn (SPA) bằng cách chụp nhanh chế độ xem và cho phép DOM thay đổi mà không có bất kỳ sự chồng chéo nào giữa các trạng thái. Sử dụng tính năng Chuyển đổi khung hiển thị để tạo hiệu ứng chuyển đổi tuỳ chỉnh hoặc sử dụng chế độ mặc định chuyển đổi đơn giản để cải thiện trải nghiệm người dùng.
Hãy xem bài viết dành cho Nhà phát triển Chrome để biết thêm thông tin và ví dụ về chuyển đổi nhằm giúp bạn bắt đầu.
Tiện ích mã hoá video có thể mở rộng WebRTC
Tiện ích này xác định một phương pháp chuẩn để chọn giữa các cấu hình Mã hoá video có thể mở rộng (SVC) có thể có trên bản nhạc video WebRTC gửi đi.
Thuộc tính WebXR enabledFeatures
Trả về tập hợp các tính năng đã được bật cho XRSession này theo chỉ định của XRSessionInit và các Tính năng ngụ ý mà quy cách yêu cầu cho chế độ và tính năng đã cho. Đối với một Phiên đã cấp, phiên này sẽ chứa tất cả requiredFeatures nhưng có thể là tập hợp con của optionalFeatures. Hầu hết các tính năng đều có cách khác để phát hiện xem chúng đã được cấp hay chưa; tuy nhiên, đối với một số tính năng, tín hiệu cho biết một tính năng có được bật hay không có thể liên quan chặt chẽ đến dữ liệu của một tính năng hiện không có sẵn, chứ không phải dữ liệu chưa có sẵn. Bằng cách truy vấn enabledFeatures, bạn có thể xác định xem có gợi ý hữu ích nào (ví dụ: để cải thiện hoặc bắt đầu theo dõi) hiển thị hay không, hoặc liệu một tính năng nào đó sẽ không bao giờ được hỗ trợ trong phiên hiện tại.
Đang chạy bản dùng thử theo nguyên gốc
Trong Chrome 111, bạn có thể chọn tham gia các bản dùng thử theo nguyên gốc mới sau đây.
Ngừng sử dụng bản dùng thử để xoá tính năng bỏ qua CSP connect-src trong Web Payment API
Ngừng cho phép API Thanh toán web bỏ qua chính sách CSP connect-src khi tìm nạp tệp kê khai. Sau khi ngừng sử dụng này, chính sách CSP connect-src của trang web sẽ cần cho phép URL của phương thức thanh toán được chỉ định trong lệnh gọi PaymentRequest, cũng như mọi URL khác mà chuỗi phương thức tìm nạp tệp kê khai.
Khả năng bỏ qua này sẽ bị loại bỏ trong Chrome 111 với bản dùng thử theo nguyên gốc ngược từ 111 đến 113 dành cho những nhà phát triển cần tạm thời bật lại chế độ bỏ qua này. Để chọn sử dụng tính năng này, hãy đăng ký bản dùng thử không dùng nữa đối với cơ chế bỏ qua CSP connect-src.
Hình trong hình của tài liệu
API Hình trong hình của tài liệu là một API mới để mở cửa sổ luôn ở trên cùng có thể chứa nội dung HTML tuỳ ý. Đây là bản mở rộng dựa trên API Hình trong hình hiện có, chỉ cho phép đưa HTMLVideoElement vào cửa sổ Hình trong hình. Nhờ đó, nhà phát triển web có thể cải thiện trải nghiệm Hình trong hình cho người dùng.
Đọc tài liệu về Hình trong hình tài liệu.
Đăng ký bản dùng thử theo nguyên gốc Hình trong hình của tài liệu.
Ngừng sử dụng và xoá
Phiên bản Chrome này giới thiệu các ngừng sử dụng và xoá được liệt kê dưới đây. Hãy truy cập vào ChromeStatus.com để xem danh sách các phương thức ngừng hoạt động theo kế hoạch, không dùng nữa và các lượt xoá trước đây.
Bản phát hành Chrome này xoá 3 tính năng.
Xoá phương thức thanh toán
PaymentInstruments là một API Web hỗ trợ lượt cài đặt ứng dụng thanh toán không phải JIT (xem https://w3c.github.io/payment-handler/). Dịch vụ này được thiết kế với giả định rằng trình duyệt sẽ lưu trữ thông tin chi tiết về phương thức thanh toán thực tế, hoá ra không đúng và có một số rò rỉ về quyền riêng tư. Ngoài ra, phiên bản này chưa được vận chuyển trên bất kỳ trình duyệt nào khác và chưa được các nhà cung cấp trình duyệt khác quan tâm. Do đó, API này không còn được dùng nữa và bị xoá.
Xoá bỏ qua CSP connect-src trong Web Payment API
Ngừng sử dụng tính năng để API Thanh toán trên web bỏ qua chính sách CSP của connect-src khi tìm nạp tệp kê khai. Sau khi bị xoá, chính sách CSP connect-src của một trang web sẽ cần cho phép URL của phương thức thanh toán được chỉ định trong lệnh gọi PaymentRequest, cũng như mọi URL khác mà các phương thức này tạo chuỗi để tìm nạp tệp kê khai.
Hãy xem thông tin trong bản dùng thử theo nguyên gốc để biết phương thức chọn tham gia bản dùng thử không dùng nữa, nhờ đó có thêm thời gian thực hiện các thay đổi cần thiết do quyết định xoá này.
Danh tính người bán trong canmakepayment sự kiện
Sự kiện trình chạy dịch vụ canmakepayment cho người bán biết liệu người dùng có thẻ trong hồ sơ trong ứng dụng thanh toán đã cài đặt hay không. Sự kiện này dùng để tự động chuyển dữ liệu tuỳ ý và nguồn gốc của người bán cho một trình chạy dịch vụ từ nguồn gốc của ứng dụng thanh toán. Hoạt động giao tiếp giữa các nguồn gốc này diễn ra trong quá trình tạo PaymentRequest trong JavaScript, không yêu cầu cử chỉ của người dùng và không hiển thị bất kỳ giao diện người dùng nào. Đoạn dữ liệu im lặng này đã bị xoá khỏi sự kiện canmakepayment và Ý định IS_READY_TO_PAY của Android).