探索 2023 年 4 月穩定版和 Beta 版網路瀏覽器提供的一些有趣功能。
穩定版瀏覽器
Firefox 112 和 Chrome 112 已於 2023 年 4 月推出穩定版。一起來看看這對網路平台的影響。
inert 屬性
Firefox 112 包含 inert 全域屬性。這個屬性會指示瀏覽器忽略元素，指出不應與內容互動的內容。簡要說明如下：
- 避免觸發
click事件。 - 防止元素取得焦點。
- 從無障礙功能樹狀結構中排除元素及其內容。
此屬性現在在這三個引擎中都具有互通性。
linear() 加/減速函式
linear() 加/減速函式可讓多個點之間的線性內插類型設定。這個模式可啟用更複雜的動畫，例如彈跳和彈性效果。此功能在 Firefox 112 中。
瀏覽器支援
- 113
- 113
- 112
- 17.2
CSS 巢狀結構
Chrome 112 開始支援 CSS Nesting，這是許多開發人員極度期待的功能。這項變更導入了新的巢狀選取器 >，用於為相關樣式規則建立巢狀結構，而使用預先處理工具的開發人員應該不會感到熟悉：
.nesting {
color: hotpink;
> .is {
color: rebeccapurple;
> .awesome {
color: deeppink;
}
}
}
CSS animation-composition
Chrome 112 也支援 animation-composition。想瞭解這項屬性的運作方式，請參閱「指定如何利用動畫組合來結合多個動畫效果」。
全新無頭模式
如果您使用 Chrome 的無頭模式 (例如 Puppeteer)，112 就會推出全新的無頭模式。如要瞭解這項功能，請參閱 Chrome 的無頭模式升級。
Beta 版瀏覽器版本
「Beta 版瀏覽器」可讓您預覽瀏覽器下一個穩定版本即將推出的功能。敬請把握這個大好機會，測試及移除哪些功能，以免影響網站在全球發布前受到影響。新的 Beta 版功能包括 Firefox 113 和 Chrome 113，以及 Safari 16.5 Beta 版仍在進行中。這些版本為 YouTube 平台帶來許多絕佳功能。請查看版本資訊，瞭解所有細節，以下只是其中幾項重點摘要。
Firefox 113 包含 color()、lab()、lch()、oklab() 和 oklch() 函式。此外也包含 CSS 顏色 5 的 color-mix() 函式和 forced-color-adjust 屬性。
Firefox 也使用 nth-child of <selector> 語法，可讓您更精確地控制您要選取的元素。詳情請參閱「使用 S 語法進一步控制 :nth-child() 選項」。
對於 CSS，Chrome 113 提供 overflow-inline、overflow-block 和 update 媒體功能。此外，linear() 加/減速函式和未前置字元的 image-set() 類型也包含在內。
Chrome 113 還包含 WebGPU，也就是採用 WebGL 和 WebGL 2 圖形 API 網頁版的後續版本，不僅提供 GPU 運算、減少 GPU 硬體負擔、能從單個圖形裝置算繪至多個畫布的功能，以及更可預測的效能，更提供新式功能。
網路新手系列叢書部分