再次在 2023 年，所有主要瀏覽器供應商和其他利害關係人攜手合作，共同解決最常見的瀏覽器相容性問題。
2023 年，所有主要的瀏覽器供應商和其他相關人員都將再次合作，解決最常見的瀏覽器相容性問題。我們之所以在 2022 年將互通性納入上述規模，建議您閱讀年終貼文，瞭解我們如何共事。所有相關人員都相信，這會改善世界各地的網頁程式開發人員體驗。今年，我們首次公開宣布提案程序，從各界架構、大型公司、瀏覽器廠商和開發人員身上獲得許多不錯的建議。
2023 年互通性的重點領域
這次我們沒有少於 26 個重點領域，詳情請參閱我們的專案文件。它們按照字母順序排列：
- CSS 中的框線圖片
- CSS 中的色彩空格和函式
- CSS 中的容器查詢
- CSS 中的遏制
- CSS 虛擬類別
- CSS 中的自訂屬性
- Flexbox
- 字型功能偵測和調色盤
- 表單
- 格線
- :has()
- 斷言
- CSS 遮蓋
- CSS 中的數學函式
- 媒體查詢
- Web Worker 中的模組
- CSS 動畫中的 Motion Path
- 螢幕外畫布
- 遊標和滑鼠事件
- 網址
- 2023 年 Web Compat：影響已知網站相容性問題的小型錯誤通用專區
- 網頁轉碼器 (影片)
- 網頁元件
您可以在 Web Platform 測試 (根據 MDN 網路文件) 的基礎上，找到所有重點領域的完整詳細資料。以下是我們您可能會想瞭解的幾個重點。
容器查詢
多年來，容器查詢一直是開發人員的首選要求，在 2022 年的 Chrome 和 Safari 中更是如此。Firefox 預期會在 Firefox 110 中傳送容器查詢，並針對此重點領域進行測試，以確保容器查詢可在各瀏覽器和符合規格下穩定運作。
:has(...)
開發人員長時間要求 CSS 中的上層選取器。:has() 虛擬類別可以使父項選取器的許多用途，以及選取先前與參照元素相關的同層級元素。舉例來說，您可以將具有不同說明文字的圖片樣式設為不同樣式。如要進一步瞭解 has() 的用途，請參閱「:has() (系列選取器)」。
自訂屬性
CSS 自訂屬性 (也稱為 CSS 變數) 可讓您在樣式表中定義一個值，並在許多位置重複使用，減少重複的情況。舉例來說，您可以在樣式表中一次定義常用顏色或字型大小，並跨元件使用該顏色。瀏覽器已長久支援自訂屬性的基本支援。2023 年互通性著重於 @property 規則。@property 代表樣式表中的自訂屬性註冊，可讓您檢查屬性類型、設定預設值，以及這個屬性是否應沿用值。詳情請參閱 @property: 提供 CSS 變數的超能力一文。
CSS 遮罩
CSS 遮罩可讓您使用 CSS 套用圖片效果，例如在圖形應用程式中看到的圖片。各種遮蓋屬性的支援程度很小，導致使用難度比預期困難。這個重點領域將有助開發人員放心在各種瀏覽器中使用廣告素材效果。如要進一步瞭解如何為圖片套用特效，請參閱這篇有關圖片遮罩的文章。
OffscreenCanvas
<canvas> 元素和 Canvas API 可讓您透過指令碼將圖形繪製到螢幕畫面。不過，由於工作是在與使用者互動相同的執行緒上完成，可能會造成效能問題。OffscreenCanvas 會為開發人員提供與 DOM 和 Canvas API 分離的畫布。開發人員也可以在 Web Worker 中執行轉譯工作，與主要執行緒分開執行。進一步瞭解 OffscreenCanvas 的效能優勢。
指標和滑鼠事件
使用滑鼠、畫筆、觸控筆或觸控螢幕與網頁互動時，就會觸發遊標事件。使用滑鼠時會引發滑鼠事件，但由於歷史因素，也會觸發滑鼠事件。本重點區域涵蓋指標和滑鼠與網頁的互動行為，包括它們與命中測試及捲動區域的互動方式。這個區域沒有網路平台測試，因此 2023 年的重點區域排除了觸控筆和觸控筆。
WebCodecs
WebCodecs API 提供開發人員存取影片個別影格和音訊區塊的方法。這可讓您存取瀏覽器中現有的轉碼器，並透過多種介面與其互動。「使用 WebCodecs 處理影片」一文說明瞭如何使用 API 將個別影格解碼，並算繪為畫布。
網頁元件
「網頁元件」泛指多項技術 (例如自訂元素和 Shadow DOM)，2023 年互通性將著重在提升這些基礎技術的互通性。
資訊主頁
前往 2023 年互通性資訊主頁追蹤全年進度，瞭解所有主要瀏覽器引擎的目前分數，以及解決這些重點區域的進度。
「焦點區域」分數是根據測試通過率計算而得。如有任何意見或想協助改善 WPT，請提出問題，要求更新用於評分的測試組合。
