Khám phá một số tính năng thú vị đã ra mắt trên các trình duyệt web ổn định và thử nghiệm trong tháng 3 năm 2023.
Bản phát hành trình duyệt ổn định
Vào tháng 3 năm 2023, Firefox 111, Chrome 111 và Safari 16.4 đã bắt đầu hoạt động ổn định. Hãy cùng xem ý nghĩa của điều này đối với nền tảng web.
Thuộc tính HTML chung
Firefox 111 thêm tính năng hỗ trợ cho một số thuộc tính HTML chung hữu ích. Thuộc tính autocapitalize kiểm soát việc hệ thống có thể tự động viết hoa văn bản khi người dùng nhập trên bàn phím ảo hay không.
Thuộc tính translate cho biết liệu có cần dịch một phần tử khi bản địa hoá một trang hay không.
Hệ thống tệp riêng tư gốc (OPFS)
Firefox bổ sung tính năng hỗ trợ cho Hệ thống tệp gốc riêng tư (OPFS) khi sử dụng API Truy cập hệ thống tệp. Tìm hiểu thêm về OPFS.
API chuyển đổi khung hiển thị
Chrome 111 bổ sung API Chuyển đổi khung hiển thị, giúp việc tạo các hiệu ứng chuyển đổi chỉn chu trong Ứng dụng trang đơn (SPA) trở nên đơn giản hơn bằng cách chụp nhanh các khung hiển thị 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.
Hãy tìm hiểu thêm trong bài đăng ra mắt Hiệu ứng chuyển đổi khung hiển thịSPA xuất hiện trong Chrome 111.
Hàm và hệ màu CSS mới
Ngoài ra, Chrome 111 còn mang đến một tập hợp hoàn toàn mới về cách sử dụng màu sắc trên web. Chrome hiện hỗ trợ hệ màu truy cập vào các màu bên ngoài gam màu RGB, cùng với các hàm color() và color-mix(). Tìm hiểu thêm trong Hướng dẫn về màu sắc có độ phân giải cao về CSS và bài đăng trên blog về color-mix() của chúng tôi.
Bản phát hành Chrome cũng bao gồm Công cụ cho nhà phát triển mới để giúp bạn làm việc với chức năng màu mới này.
Có nhiều quyền kiểm soát hơn đối với :nth-child() lựa chọn
Chrome 111 bổ sung khả năng truyền danh sách bộ chọn vào :nth-child() và nth-last-child(). Tìm hiểu thêm về vấn đề này và xem các ví dụ trong bài đăng Kiểm soát thêm đối với các lựa chọn :nth-child() bằng cú pháp S.
Hỗ trợ trình duyệt
- 111
- 111
- 113
- 9
Hỗ trợ cho trang trình bày trước và tiếp theo trong Media Session API
Cuối cùng, trong danh sách các tiện ích bổ sung này của Chrome 111 là Thao tác trình bày trang trình bày cho API phiên đa phương tiện – "previousslide" và "nextslide".
Hỗ trợ trình duyệt
- 111
- 111
- x
- x
Hỗ trợ lớp giả trong Safari
Safari 16.4 là một bản phát hành tuyệt vời cho nền tảng web. Bài viết này sẽ không đề cập đến tất cả nội dung bổ sung, vì vậy hãy xem danh sách đầy đủ các tính năng trong ghi chú phát hành của Safari 16.4.
Bản phát hành này có thêm một loạt các lớp giả CSS bổ sung được hỗ trợ trong bản phát hành này: :user-invalid, :user-valid, :dir(), :modal và :fullscreen.
Cú pháp mới cho dải ô cho truy vấn nội dung nghe nhìn
Bản phát hành Safari này giúp cú pháp phạm vi thanh lịch và hữu ích hơn nhiều cho các truy vấn đa phương tiện có khả năng tương tác trên cả ba công cụ. Bạn có thể xem ví dụ về cú pháp này trong bài đăng này (được xuất bản khi cú pháp được chuyển trong Chrome).
Thuộc tính và giá trị CSS
Safari 16.4 bổ sung tính năng hỗ trợ cho @property, cho phép đăng ký thuộc tính tuỳ chỉnh CSS trực tiếp trong một biểu định kiểu. Tìm hiểu thêm về điều này trong @property: cung cấp siêu năng lực cho các biến CSS.
Hỗ trợ CSS API
Chúng tôi sẽ tiếp tục bổ sung các tính năng tuyệt vời cho CSS, cùng với dịch vụ hỗ trợ cho CSS theo loại OM. API này hiển thị các giá trị CSS dưới dạng đối tượng JavaScript đã nhập thay vì chuỗi. Công cụ này giúp làm việc với CSS trong JavaScript dễ dàng hơn và mang lại hiệu quả cao hơn so với các phương thức hiện có.
Ngoài ra, chúng tôi cũng hỗ trợ biểu định kiểu có thể tạo bằng CSSStyleSheet(). Thao tác này cho phép chia sẻ biểu định kiểu giữa một tài liệu và cây con DOM bóng của tài liệu đó. Với phiên bản Safari này, biểu định kiểu có thể tạo hiện được hỗ trợ trong cả ba công cụ.
Thông báo đẩy trên web và API Huy hiệu
Safari hiện hỗ trợ tính năng Đẩy web cùng với API Huy hiệu. Đây là một tin vui cho các nhà phát triển ứng dụng. Đặc biệt, phiên bản này có nghĩa là thông báo đẩy đều được hỗ trợ trong tất cả các công cụ chính.
Nhập bản đồ
Một điểm bổ sung khác giúp một tính năng chuyển sang trạng thái có thể tương tác là bổ sung tính năng Import maps (Nhập bản đồ) JavaScript, giúp việc nhập các mô-đun ES dễ dàng hơn nhiều.
Hỗ trợ trình duyệt
- 89
- 89
- 108
- 16,4
Bản phát hành trình duyệt thử nghiệm
Phiên bản trình duyệt beta cho phép bạn xem trước những tính năng sẽ có trong phiên bản ổn định tiếp theo của trình duyệt. Đây là thời điểm thích hợp để thử nghiệm các tính năng mới hoặc yêu cầu xoá có thể ảnh hưởng đến trang web của bạn trước khi toàn cầu nhận được bản phát hành đó. Các phiên bản beta mới là Firefox 112, Safari 16.5 và Chrome 112. Những bản phát hành này mang đến nhiều tính năng tuyệt vời cho nền tảng. Hãy xem ghi chú phát hành để biết toàn bộ thông tin chi tiết. Dưới đây chỉ là một vài điểm nổi bật.
Firefox 112 thêm tính năng hỗ trợ cho thuộc tính inert, giúp thuộc tính hữu ích này hoạt động trên mọi công cụ. Bạn có thể tìm hiểu thêm về trơ trong phần Giới thiệu về trơ. Firefox cũng sẽ cho phép hỗ trợ hàm easing linear().
Chrome 112 và Safari 16.5 đều hỗ trợ thêm cho CSS Nesting (Lồng ghép CSS), một tính năng rất được nhiều nhà phát triển mong đợi.
Chrome 112 cũng hỗ trợ animation-composition. Tìm hiểu cách hoạt động của thuộc tính này trong phần Chỉ định cách kết hợp nhiều hiệu ứng ảnh động với kết hợp ảnh động.
Nếu bạn sử dụng chế độ Không có giao diện người dùng của Chrome, chẳng hạn như với Puppeteer, thì 112 sẽ mang đến một chế độ Không có giao diện hoàn toàn mới. Tìm hiểu về tính năng này trong chế độ Không có giao diện người dùng của Chrome được nâng cấp.
Một phần của Loạt video mới dành cho web