探索穩定版和 Beta 版帶來的一些有趣功能 網路瀏覽器。
穩定版瀏覽器版本
自 2023 年 12 月起 Firefox 121, Chrome 120,以及 Safari 17.2 已穩定運作。 本文旨在說明網路平台代表的意義。
CSS 巢狀結構剖析
Chrome 120 和 Safari 17.2 包含 CSS 巢狀結構的寬鬆剖析。 Firefox 117 版已支援這種語法,因此所有主要引擎都支援這項語法變更。
具有 <details> 元素的專屬配音
Chrome 120 和 Safari 17.2 支援對 name 屬性
<details> 元素。換句話說,開發人員能建立專屬摺疊元素
就能將多個 <details> 元素分組。
詳情請參閱獨家功能。
瀏覽器支援
- 120
- 120
- x
- 17.2
:has() 選取器
Firefox 121 包含 CSS :has() 選取器。這個版本能讓 :has() 在所有主要引擎中互通。
如要瞭解詳情,請前往 :has():家庭選取器。
CSS Custom Highlight API
Safari 17.2 包含
CSS 自訂醒目顯示 API
可讓您建立文字範圍並設定樣式
擴充標準醒目顯示虛擬類別,例如 ::selection。
CloseWatcher API
Chrome 120 包含 CloseWatcher API,這個新的 API 可用於監聽及回應關閉要求。
這些要求會由電腦上的 ESC 鍵和 Android 上的返回手勢或按鈕觸發,
實作起來可能不容易
除了 API 外,Chrome 120 還升級了 <dialog> 和 popover 屬性,以便回應 Android 返回按鈕。
瀏覽器支援
- 126
- 126
- x
- x
CSS text-wrap: balance 和 stable
Firefox 121 包含 text-wrap 的 balance 和 stable 值。
balance 值適用於標題、
打造更賞心悅目且易於閱讀的文字stable 值禁止在編輯時,讓可編輯內容恢復顯示狀態。
進一步瞭解text-wrap: balance。
延遲載入 <iframe> 元素
Firefox 121 支援在 <iframe> 元素上使用 loading 屬性。
換句話說,所有主要引擎現在都支援 iframe 的延遲載入功能。
瀏覽器支援
- 77
- 79
- 121
- 16.4
支援 linear() 加/減速函式
Safari 17.2 也支援 linear() 加/減速函式,可用來建立
彈跳和彈簧效果。
瀏覽器支援
- 113
- 113
- 112
- 17.2
Beta 版瀏覽器版本
Beta 版瀏覽器可讓您預覽即將推出的功能 瀏覽器的穩定版。現在正是測試新功能的好時機 移除。全新內容 Beta 版是 Firefox 122、 Chrome 121 和 Safari 17.3。 這些版本為平台帶來許多實用功能。查看版本 記下所有細節以下列舉幾個重點。
Firefox 122 和 Chrome 121 加入 HTMLSelectElement 的 showPicker() 方法。
這會顯示與選取元素時相同的挑選器。
但可以透過按下按鈕或其他使用者互動來觸發
Chrome 121 版包含捲軸樣式屬性 scrollbar-color 和 scrollbar-width,
以及改良版 SVG 的 CSS 遮蓋功能
並醒目顯示拼錯或文法錯誤的文字