Khám phá một số tính năng thú vị đã xuất hiện trong các trình duyệt web ổn định và beta trong tháng 9 năm 2026.
Xuất bản: Ngày 2 tháng 10 năm 2026
Bản phát hành trình duyệt ổn định
Đây là tháng đầu tiên Chrome và Firefox phát hành phiên bản mới hai tuần một lần. Điều đó có nghĩa là Chrome 153, Chrome 154, Firefox 155, Firefox 156, Firefox 157 và Safari 27 sẽ được phát hành cho phiên bản ổn định trong tháng 9 năm 2026. Bài đăng này trình bày về các tính năng mới xuất hiện trên nhiều trình duyệt, bao gồm cả một số lượng lớn tính năng mới đạt đến trạng thái Cơ sở mới có sẵn.
Hàm progress() CSS trở thành Đường cơ sở
Firefox 155 bổ sung tính năng hỗ trợ cho hàm toán học progress() trong CSS, giúp hàm này có sẵn trong Baseline.
Hàm progress() trả về một <number> biểu thị vị trí của một phép tính giữa giá trị bắt đầu và giá trị kết thúc. Thông thường, kết quả được giới hạn trong khoảng từ 0 đến 1, điều này giúp kết quả hữu ích cho việc điều khiển kích thước, độ mờ hoặc màu sắc của chất lỏng dựa trên kích thước vùng chứa hoặc khung hiển thị. Cả Firefox 155 và Safari 27 cũng hỗ trợ lựa chọn từ khoá no-clamp, cho phép giá trị tiến trình được trả về mở rộng xuống dưới 0 hoặc lên trên 1.
.card {
opacity: progress(100vw, 320px, 1200px);
}
Màu alpha tương đối có alpha() trở thành Cơ sở
Firefox 155 và Safari 27 đều thêm tính năng hỗ trợ cho hàm màu tương đối alpha() từ CSS Color 5.
Hàm alpha() lấy một màu gốc và trả về màu đó với kênh alpha (độ trong suốt) đã điều chỉnh trong khi vẫn giữ nguyên các kênh màu và không gian màu:
.overlay {
background-color: alpha(var(--brand-color) / 50%);
}
Với việc Chrome 151, Firefox 155 và Safari 27 đều hỗ trợ alpha(), chức năng này hiện đã có trong Baseline Newly.
Từ khoá revert-rule CSS trở thành Cơ sở
Safari 27 bổ sung tính năng hỗ trợ cho từ khoá revert-rule trên toàn bộ CSS.
Trong khi revert quay lại tầng xếp lớp cho nguồn gốc của người dùng hoặc tác nhân người dùng và revert-layer quay lại một tầng xếp lớp trước đó, revert-rule sẽ quay lại giá trị của một thuộc tính như giá trị đó sẽ có nếu không có quy tắc kiểu hiện tại. Với sự hỗ trợ trong Chrome, Firefox và hiện tại là Safari 27, revert-rule hiện đã có trong Baseline.
Giá trị <image> trong light-dark() trở thành Đường cơ sở
Safari 27 bổ sung hỗ trợ cho việc sử dụng các giá trị <image> bên trong hàm CSS light-dark().
Trước đây chỉ giới hạn ở các giá trị <color>, giờ đây light-dark() có thể chuyển đổi giữa hai hình ảnh (chẳng hạn như hình ảnh url() hoặc các độ dốc CSS) dựa trên color-scheme sáng hoặc tối đang hoạt động. Với sự hỗ trợ trên Chrome, Firefox và Safari 27, các giá trị <image> trong light-dark() hiện đã có trong Baseline Newly.
Browser Support
Tính năng cố định khi cuộn bằng overflow-anchor trở thành Baseline
Safari 27 cho phép cố định vị trí cuộn và thêm tính năng hỗ trợ cho thuộc tính CSS overflow-anchor.
Tính năng cố định vị trí cuộn sẽ tự động điều chỉnh vị trí cuộn khi các thay đổi về DOM phía trên khung hiển thị có thể nhìn thấy sẽ khiến nội dung bị nhảy trong khi người dùng đang đọc hoặc tương tác với trang. Bạn có thể sử dụng overflow-anchor: none để chọn không cho phép các phần tử cụ thể hoạt động dưới dạng nút liên kết. Với việc Safari 27 tham gia cùng Chrome và Firefox, tính năng cố định vị trí cuộn hiện đã có trong Baseline Newly available (Cơ sở mới có sẵn).
Thuộc tính font-width và bộ mô tả @font-face sẽ trở thành Cơ sở
CSS Fonts 4 đã thay thế font-stretch bằng font-width làm tên chuẩn để chọn các kiểu chữ bình thường, cô đọng hoặc mở rộng, giữ font-stretch làm bí danh cũ.
Firefox 155 bổ sung tính năng hỗ trợ cho thuộc tính CSS font-width, bộ mô tả font-width
@font-face và CSSStyleDeclaration.fontWidth. Chrome 154 cũng thêm bộ mô tả font-width vào các quy tắc @font-face và thuộc tính width trên các đối tượng FontFace. Cùng với khả năng hỗ trợ hiện có trong Safari, font-width hiện đã có trong Baseline Newly.
sizes="auto" cho hình ảnh được tải từng phần sẽ trở thành Baseline
Safari 27 bổ sung hỗ trợ cho từ khoá auto trong thuộc tính sizes trên các phần tử <img> sử dụng loading="lazy".
Khi bạn chỉ định sizes="auto" (hoặc danh sách sizes bắt đầu bằng auto), trình duyệt sẽ sử dụng chiều rộng bố cục được kết xuất của hình ảnh tải chậm để chọn nguồn hình ảnh phù hợp nhất từ srcset. Với sự hỗ trợ trong Chrome, Firefox và hiện tại là Safari 27, sizes="auto" hiện đã có trong Baseline.
Hoạt động lặp lại không đồng bộ và các đối tượng ReadableStream có thể chuyển nhượng sẽ trở thành Baseline
Safari 27 có một số điểm cập nhật cho ReadableStream:
- Hỗ trợ việc lặp lại không đồng bộ trên các đối tượng
ReadableStreambằng cách sử dụng vòng lặpfor await...ofvàReadableStream.prototype.values(). - Hỗ trợ chuyển các đối tượng
ReadableStreamgiữa các ngữ cảnh bằng cách sử dụngpostMessage(). - Hỗ trợ phương thức tĩnh
ReadableStream.from()để tạoReadableStreamtừ một đối tượng có thể lặp lại hoặc đối tượng có thể lặp lại không đồng bộ (cũng được hỗ trợ trong Firefox).
Với Safari 27, các luồng có thể lặp lại không đồng bộ và các đối tượng ReadableStream có thể chuyển nhượng hiện đã có trong Baseline Newly.
Browser Support
AnimationEvent.animation và TransitionEvent.animation trở thành Cơ sở
Safari 27 thêm thuộc tính animation vào AnimationEvent và thuộc tính animation vào TransitionEvent.
Thuộc tính này trả về đối tượng Animation được liên kết với sự kiện chuyển đổi hoặc ảnh động CSS, giúp bạn dễ dàng kiểm tra hoặc kiểm soát ảnh động trực tiếp từ một trình nghe sự kiện. Với việc Chrome, Firefox và Safari 27 hỗ trợ thuộc tính này, giờ đây, thuộc tính này đã có trong Baseline Newly.
Lựa chọn maxAge trong cookieStore.set() sẽ trở thành Cơ sở
Safari 27 bổ sung hỗ trợ cho lựa chọn maxAge khi đặt cookie bằng cookieStore.set(), cho phép bạn chỉ định thời gian tồn tại của cookie dưới dạng khoảng thời gian tính bằng giây thay vì tính toán dấu thời gian expires tuyệt đối. Với sự hỗ trợ trên Chrome, Firefox và Safari 27, lựa chọn maxAge hiện đã có trong Baseline Newly.
Browser Support
<select> có thể tuỳ chỉnh trong Safari 27
Safari 27 bổ sung tính năng hỗ trợ các trình đơn <select> có thể tuỳ chỉnh bằng cách sử dụng appearance: base-select và phần tử <selectedcontent>, tham gia Chrome.
Chọn <select> và phần tử giả ::picker(select) của phần tử này vào appearance: base-select sẽ chuyển chế độ kiểm soát sang giao diện cơ bản có thể tạo kiểu, cho phép nội dung HTML phong phú bên trong các phần tử <option> và kiểu tuỳ chỉnh cho nút và bộ chọn thả xuống.
Browser Support
Các phần tử khai báo <camera> và <microphone> trong Chrome
Chrome 153 giới thiệu các phần tử khả năng HTML <camera> và <microphone>.
Dựa trên phần tử <usermedia>, <camera> và <microphone> cung cấp các chế độ kiểm soát khai báo chuyên dụng do người dùng kích hoạt để yêu cầu quyền truy cập vào tính năng quay video hoặc ghi âm đơn lẻ mà không kích hoạt lời nhắc quyền do tập lệnh khởi tạo khi tải trang.
Browser Support
Các thành phần bổ sung Iterator và Promise của JavaScript
Chrome 153 bổ sung Iterator.prototype.join() cùng với quá trình lặp lại chung bằng cách sử dụng Iterator.zip() và Iterator.zipKeyed().
Firefox 155 triển khai Promise.allKeyed() và Promise.allSettledKeyed(), chấp nhận một đối tượng từ điển gồm các promise và phân giải thành một đối tượng có cùng khoá.
Các điểm cập nhật WebTransport trong Firefox 155
Firefox 155 mở rộng việc triển khai WebTransport:
- Hỗ trợ thương lượng giao thức ở cấp ứng dụng bằng lựa chọn
protocolstrong hàm khởi tạoWebTransport()và thuộc tínhWebTransport.protocol. Với sự hỗ trợ trong Chrome, Safari và hiện tại là Firefox 155,WebTransport.protocolhiện đã có trong Baseline. - Hỗ trợ cho
createSendGroup(),draining,exportKeyingMaterial()vàWebTransportDatagramDuplexStream.createWritable().
Service Worker Static Routing API trong Safari 27
Safari 27 bổ sung tính năng hỗ trợ Service Worker Static Routing API thông qua InstallEvent.addRoutes().
API này cho phép một trình chạy dịch vụ đăng ký các quy tắc định tuyến khai báo tại thời gian cài đặt để các yêu cầu phù hợp có thể bỏ qua quá trình khởi động trình chạy dịch vụ và tìm nạp trực tiếp từ mạng hoặc bộ nhớ đệm, giúp cải thiện hiệu suất điều hướng.
Bản phát hành trình duyệt beta
Các phiên bản trình duyệt thử nghiệm 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 để kiểm thử các tính năng mới hoặc việc xoá các tính năng có thể ảnh hưởng đến trang web của bạn trước khi bản phát hành đó được triển khai trên toàn thế giới. Các phiên bản beta mới trong tháng này là Chrome 155, Chrome 156, Firefox 158 và Safari 27.2.
Chrome 155 beta có CSS margin-trim, symbols() và text-decoration-skip-spaces, cùng với khả năng hỗ trợ giải mã JPEG XL (image/jxl), nhập mô-đun văn bản (import ... with { type: "text" }) và hỗ trợ phát hành Digital Credentials API.
Chrome 156 beta bao gồm hàm CSS random(), các thuộc tính rút gọn CSS corner, các vùng chứa cuộn một trục, scroll-snap-type: pair, thuộc tính image-animation và lớp giả :animated-image, các lớp giả trạng thái của phần tử đa phương tiện (:playing, :paused, :seeking, :buffering, :stalled, :muted, :volume-locked), việc đánh giá mô-đun bị hoãn lại (import defer), phần tử HTML <install> và Web Install API.
Safari 27.2 beta bổ sung tính năng hỗ trợ cho chế độ căn chỉnh tràn safe và unsafe khi kết hợp với normal, cho phép căn chỉnh safe trên các hộp có vị trí cố định và các phần tử ::picker(select), đồng thời đổi tên flow-tolerance thành fit-tolerance cho display: grid-lanes.