以下是 2026 年 8 月 27 日發行的 Microsoft Edge 152 中新的 Web 平台功能和更新。
若要保持最新狀態並取得最新的 Web 平台功能,請下載 Microsoft Edge (Beta、Dev 或 Canary) 的預覽通道;移至 成為 Microsoft Edge 測試人員。
詳細內容:
Microsoft Edge 開發工具
查看 Microsoft Edge DevTools 的新增功能。
WebView2
請參閱 WebView2 SDK 的版本資訊。
CSS 功能
Microsoft Edge 中包含下列新的階層式樣式表 (CSS) 功能。
CSS alpha() 函數
CSS alpha() 函數會將指定的 alpha 值套用至現有的色彩,以建立新色彩。
例如, alpha(from red / 0.5) 建立不透明度為 50% 的半透明紅色。
另請參閱:
- CSS 顏色模組等級 5 中的相對 alpha 顏色。
CSS window-drag 屬性
在已安裝的漸進式 Web 應用程式 (PWA) 中使用時, window-drag CSS 屬性會定義 Web 應用程式 UI 的區域,這些區域會表現為可拖曳的視窗標題列區域。
套用至元素時,按一下並拖曳指標互動會移動頂層應用程式視窗。
這適用於安裝在桌面作業系統上的 PWA,以及當瀏覽器提供的標題列隱藏時,使用 [視窗控制項重疊] 功能來實作自訂標題列和可拖曳區域的應用程式。
屬性會 window-drag 將現有 app-region 屬性標準化並重新命名。
另請參閱:
- 在 [使用視窗控制項重疊] 中,讓區域成為視窗的拖曳控點。
- MDN 上的視窗控制項重疊 API。
媒體元素 pseudo-classes
下列 CSS 虛擬類別會根據其狀態與元素相符<audio><video>:
:playing:paused:seeking:buffering:stalled:muted:volume-locked
另請參閱:
-
:playingMDN 中的 CSS 虛擬類別 。 -
:pausedMDN 中的 CSS 虛擬類別 。 -
:seekingMDN 中的 CSS 虛擬類別 。 -
:bufferingMDN 中的 CSS 虛擬類別 。 -
:stalledMDN 中的 CSS 虛擬類別 。 -
:mutedMDN 中的 CSS 虛擬類別 。 -
:volume-lockedMDN 中的 CSS 虛擬類別 。
HTML 功能
Microsoft Edge 中包含下列新的 HTML 功能。
<camera> 和 <microphone> 元素
和 <camera><microphone> HTML 元素是瀏覽器提供的按鈕,啟用後可切換相機或麥克風串流。 如有需要,按鈕會提示使用者選擇是否要授與頁面存取權給相機和麥克風。
<camera>和<microphone>元素與元素共用<usermedia>相同的基礎機制,但有一個關鍵區別:它們被設計為請求單一功能:
-
<camera>該元素特別要求視訊擷取。 - 元素特別
<microphone>要求音訊擷取。
與元素一樣<usermedia>,和<camera><microphone>元素也會在頁面中內嵌瀏覽器控制、樣式嚴格的 UI。 這可確保在觸發權限提示或啟動串流之前,有一個強烈、刻意的使用者訊號。
另請參閱:
-
<usermedia>Microsoft Edge 151 網頁平台版本資訊中的元素 (2026 年 7 月) 。
參照目標
物件的ShadowRoot屬性會forreferenceTarget將屬性 、 aria-labelledby、 popovertarget及 commandfor 轉送至陰影 DOM 內的元素。 例如,您可以使用它將 a <label> 連結至其 <input>,即使 位於 <input> Web 元件的陰影 DOM 中。
當陰影主機在其陰影樹狀結構中指定元素作為其參考目標時,所有指向陰影主機的識別碼參考都會轉送至參考目標元素。
您也可以在 shadowrootreferencetarget HTML 中使用屬性設定參照目標,如下列範例所示:
<label for="my-checkbox">Checkbox value</label>
<custom-checkbox id="my-checkbox">
<template shadowrootmode="open" shadowrootreferencetarget="real-checkbox">
<input id="real-checkbox" type="checkbox">
</template>
</custom-checkbox>
另請參閱:
-
referencetarget,在 MDN 的 Element:attachShadow()method 中。 -
Shadowroot.referencetarget, 於ShadowRoot, 於 MDN。 -
shadowrootreferencetarget,於 MDN 的 HTML 內容範本元素中<template>。
autocorrect 全域 HTML 屬性
全域 HTML 屬性會 autocorrect 控制是否自動校正使用者輸入 <input> 的拼字或標點符號錯誤 和 <textarea> 元素,以及具有屬性的 contenteditable 元素。
另請參閱:
Web API
Microsoft Edge 中包含下列新的 Web API 功能。
取消載入事件的計劃性淘汰
Edge 152 將引進新的 unload 權限原則,以允許建立卸載事件接聽程式。 預設值最初 allow為 ,但在 Edge 152 與 Edge 155 之間,預設值將逐漸移轉至 deny,因此卸載處理常式會停止在頁面上觸發,除非頁面明確選擇重新啟用它們。 若要明確啟用卸載事件處理常式,請使用 allow value。
- Edge 152:卸載處理常式預設會在 60% 的頁面載入中停止觸發,除非網站透過權限原則明確
unload啟用卸載處理常式。 - Edge 154:增加到頁面載入的 80%。
- Edge 155:增加到 100% 的頁面載入。
此變更會在 Microsoft Edge 所根據的 Chromium 專案中發生。
unload 事件不是執行下列動作的可靠方法,因為瀏覽器和作業系統可以在不引發 unload 事件的情況下暫停或終止頁面:
- 儲存資料。
- 執行清理。
- 報告工作階段結束。
使用 unload 事件也可以防止頁面使用向後/向前快取,這可能會使向後和向前瀏覽變慢。
您應該移轉至專為上述案例設計的生命週期事件和 API。 Web 平台的長期方向是移除對卸載事件的支援。
另請參閱:
- 意圖取代: 取代卸載事件
- Microsoft Edge 即將進行的網站相容性影響變更中的 [取代卸載事件] 列。
encryptionScheme 屬性 navigator.mediaCapabilities.decodingInfo()
除了 和 contentTyperobustness 屬性之外,您現在可以在查詢媒體功能navigator.mediaCapabilities.decodingInfo()時使用encryptionScheme該屬性。
這可讓您判斷使用者裝置上是否支援特定的轉碼器、穩定性和加密配置組合,因此偵測加密媒體是否可以播放。
另請參閱:
- MDN 的加密媒體擴充功能 API。
- MediaCapabilities: decodingInfo () MDN 的方法。
CPU 效能 API
CPU 效能 API 可讓您判斷使用者裝置的 CPU 效能。 您可以使用此資訊來提供改善的使用者體驗,可能與 Compute Pressure API 結合使用。
計算壓力 API 提供使用者裝置 CPU 壓力或使用率的相關資訊,並允許應用程式對 CPU 壓力的變更做出反應。
另請參閱:
- CPU 效能 API。
- MDN 的計算壓力 API。
CSSPseudoElement 對 ::backdrop、 ::scroll-marker和 的支援 ::view-transitions
介面代表 CSSPseudoElement 一個CSS偽元素,可以透過呼叫 Element.pseudo() 或 CSSPseudoElement.pseudo()來取得。
CSSPseudoElement除了 、 和虛擬元素之外::after,介面現在還支援 ::backdrop、 ::scroll-marker::before和::view-transitions::marker虛擬元素。
將介面與這些新的虛擬元素搭配使用, CSSPseudoElement 可讓您執行下列操作:
::backdrop: 在按一下背景時關閉對話方塊時很有用,而不會干擾對話方塊內容內的點選。 這樣就不需要複雜的交集邏輯來確定點擊發生的位置。::scroll-marker:收集點選統計資料時很有用。::view-transitions: 可讓您在飛行中途截取視圖轉場,以開始新的視圖轉場,利用目前動畫元素的座標來避免突然的視覺跳轉。
另請參閱:
- MDN 的 CSSPseudoElement 。
- 元素:MDN 中的虛擬 () 方法。
- CSSPseudoElement:MDN 中的虛擬 () 方法 。
連線允許清單
連線允許清單可讓您宣告和強制執行網路端點的明確允許清單,可透過網路 API (例如擷取 API) 連線。 這改善了輸出網路控制,並降低了意外連線的風險。
授權端點清單會透過 HTTP 回應標頭從 Connection-Allowlist 伺服器散發。 在連線到伺服器之前,瀏覽器會根據此允許清單評估目的地。 允許連線至已驗證的端點,但會封鎖無法符合允許清單中項目的目的地。
另請參閱:
OpaqueRange 針對表單控制項文字
用 OpaqueRange 來表示表單控制項值內的即時文字範圍,例如 a <textarea> 或基於文字的 <input>。
OpaqueRange 可讓您對文字範圍執行下列動作:
- 運算例如
getBoundingClientRect()getClientRects()和 。 - 與 CSS 自訂醒目提示 API 整合。
這可啟用內嵌建議、醒目提示和錨定彈出視窗等案例。
OpaqueRange 僅公開值位移來保留封裝,並傳回 nullstartContainer 和 endContainer。
另請參閱:
- MicrosoftEdge/Demos 的 OpaqueRange。
- 嘗試 OpaqueRange API。 停止使用鏡像 div 來測量輸入中的文字位置! 在 YouTube 上。
- MDN 的範圍。
WebGPU:子群組大小控制
GPU subgroup-size-control 功能可讓您在計算著色器中明確設定子群組大小。
當您需要最佳化特定平台上運算著色器的效能時,這非常有用,例如 AI 工作負載。
另請參閱:
- MDN 中的 WebGPU API。
- WebGPU 規格中的子群組。
audioSelection:preferred 選項 getDisplayMedia()
getDisplayMedia()方法現在支援此audioSelection:preferred選項。
此選項可讓您向瀏覽器指示您偏好音訊與影片的分享。
另請參閱:
- MediaDevices: getDisplayMedia () MDN 方法。
原始試用版
以下是可在 Microsoft Edge 中使用的新實驗性 API 的原始試用版。
原始試用版可讓您在限定的時間內,在自己的即時網站上嘗試實驗性 API。 若要深入了解原始試用版,請參閱在 Microsoft Edge 中使用原始試用版。
如需可用原始試用版的完整清單,請參閱 Microsoft Edge 原始試用版。
| 名稱 | 描述 | 登錄 |
|---|---|---|
| 軟瀏覽啟發學習法 | 公開軟瀏覽啟發學習法,以在單頁應用程式中收集效能計量。 | 登錄 |
| CSP script-src 中的 URL 和評估雜湊 | 為 CSP 指示詞引入 script-src url 和 eval- 雜湊,取代基於主機名稱的允許清單和 unsafe-eval。 |
登錄 |
<install> HTML 元素 |
使用 element <install> ,以宣告方式將其他網站安裝為 Web 應用程式。 |
登錄 |
focus-without-user-activation 權限原則 |
透過 focus-without-user-activation 權限原則,讓內嵌程式控制內嵌內容中的程式設計焦點。 當框架的原則遭到拒絕時,除非由使用者啟用觸發,或焦點正在委派,否則會封鎖程式設計焦點呼叫 (element.focus()、 autofocus、 window.focus()dialog.showModal()及彈出視窗聚焦) 。 |
登錄 |
| 增強型畫布 TextMetrics | 展開 TextMetrics Canvas API,新增選取矩形、邊界方塊查詢和字符叢集作業。 | 登錄 |
| WebAudio 可設定轉譯 Quantum | 可讓您在建立 AudioContext 或 OfflineAudioContext時指定自訂轉譯量子大小。 |
登錄 |
| 容器計時 | 監視何時顯示帶註解的 DOM 容器,並已完成其初始繪製。 | 登錄 |
| 在長動畫框架 API 中分開樣式和版面配置持續時間 | 新增 、 forcedStyleDuration和layoutDurationforcedLayoutDuration屬性styleDuration,以進行更深入的 CSS 效能分析。 |
登錄 |
| 提示 API 取樣參數 | 和temperature取樣參數可讓您topK最佳化每個語言模型工作階段的模型行為。 |
登錄 |
| 宣告式 CSS 模組指令碼 | 使用內嵌樣式模組與陰影根共用宣告式樣式表,包括宣告式陰影根。 | 登錄 |
| 數位認證 API - 發行支援 | 觸發從憑證簽發者伺服器向數位錢包應用程式發行使用者憑證。 | 登錄 |
prerender_until_script 推測規則 API 動作 |
推測規則 API 動作,會預先轉譯頁面,但在指令碼執行時切換為預先擷取。 | 登錄 |
| 畫布中的 HTML | 啟用使用新的繪圖方法和 paint 事件在畫布中呈現 HTML。 |
登錄 |
| 遊戲控制器原始輸入事件 | 而不是依賴透過 navigator.getGamepads()的頻繁輪詢,網頁可以監聽 gamepadrawinputchanged 事件。 每當從相同裝置偵測到輸入框架之間的變更時,就會引發這些事件。 |
登錄 |
| WebMCP | 可讓您的網站註冊工具,讓瀏覽器內代理程式代表使用者完成工作。 | 登錄 |
| 自動填滿事件 | 偵測瀏覽器自動填寫何時更新表單控制項,以調整自訂 UI 和驗證。 | 登錄 |
| Email Verification Protocol | 讓網站能夠使用電子郵件提供者所發行的密碼編譯權杖來驗證電子郵件擁有權。 這減少了對電子郵件一次性密碼 (OTP) 的依賴,並簡化了註冊、登入和復原流程。 | 登錄 |
| 預先轉譯跨原始來源 iframe | 透過選擇加入的回應標頭預先轉譯跨原始來源 iframe,而不是延遲到頁面啟用。 | 登錄 |
| WebAssembly 自訂描述元 V2 | 將與來源層級類型相關聯的資料更有效率地儲存在自訂描述元物件中。 | 登錄 |
| 推測負載測量 |
performance.speculations 公開有關已使用和未使用的預載、預先擷取和預轉譯的資料。 這可協助您衡量推測載入策略的有效性,並最佳化效能與成本的權衡。 |
登錄 |
| 其他 WebCrypto 演算法 | 啟用其他 WebCrypto 演算法的使用,包括一些 PQ 演算法。 啟用的演算法: ChaCha20-Poly1305、ML-DSA-44、ML-DSA-65、ML-DSA-87、ML-KEM-768、ML-KEM-1024、MLKEM768-X25519。 | 登錄 |
| WebRTC 資料通道: SCTP 交涉加速通訊協定 (SNAP) | SNAP 會藉由在 SDP 提供/回應交換中內嵌 SCTP 連線設定參數,減少 WebRTC 資料通道啟動延遲。 由於 WebRTC 已經使用 DTLS 來建立安全通道,因此可以避免單獨的 SCTP 交握,從而節省多達兩次網路往返並實現更快的資料通道建立。 | 登錄 |
注意事項
本頁面的部分內容是基於 Chromium.org 創建和共享的工作進行的修改,並根據知識共享署名 4.0 國際許可證中描述的條款使用。