Microsoft Edge 150 Web 平台版本資訊 (2026 年 7 月)

以下是 2026 年 7 月 2 日發行之 Microsoft Edge 150 中新的 Web 平台功能和更新。

若要保持最新狀態並取得最新的 Web 平台功能，請下載 Microsoft Edge (Beta、Dev 或 Canary) 的預覽通道;移至 成為 Microsoft Edge 測試人員。

詳細內容：

Microsoft Edge 開發工具

查看 DevTools 的新增功能 (Microsoft Edge 150) 。

WebView2

請參閱 WebView2 SDK 版本資訊中的 2026 年 7 月 7 日 (執行階段 150 的發行 SDK 1.0.4078.44) 。

CSS 功能

Microsoft Edge 中包含下列新的階層式樣式表 (CSS) 功能。

AccentColor 和 AccentColorText 系統色彩

AccentColor現在可以使用 和AccentColorText系統色彩做為 CSS 色彩值，以存取使用者裝置上指定的系統輔色。

另請參閱:

允許選擇性四捨五入參數 polygon()

允許在 CSS shape 函數中使用polygon()選用round參數。 您可以指定長度值來圓角多邊形轉角，而無需手動計算貝塞爾曲線。

例如，若要建立圓角三角形： polygon(round 50px, 50% 0%, 0% 100%, 100% 100%)

另請參閱:

可動畫縮放

CSS zoom 屬性可以動畫處理，並 <number>以 . 您可以轉換縮放並設定動畫，以平滑地縮放元素及其版面配置，以補充現有的轉換型縮放比例。

另請參閱:

CSS URL 要求修飾詞

下列 CSS 函式可以與 CSS url() 函式搭配使用，以控制參考資源的擷取行為：

  • cross-origin()
  • integrity()
  • referrer-policy()

例如， background-image: url("image.png" cross-origin(anonymous)) 使用 CORS 匿名模式擷取映像。

這可讓您對CSS載入資源的跨原始來源存取、子資源完整性和查閱者原則進行更精細的控制，包括：

  • 影像。
  • 字型。
  • SVG 參考資料。
  • 匯入的樣式表。

另請參閱:

CSS text-fit 屬性

CSS text-fit 屬性會縮放文字節點的字型大小，以完美符合其所包含方塊的寬度。

此屬性可讓您確保標題或動態內容填滿可用的水平空間，而不需要手動計算字型大小或複雜的 JavaScript 因應措施。

此屬性為回應式排版提供了強大的 CSS 原生解決方案，可在不同螢幕大小和不同文字長度之間保持視覺對齊。

另請參閱:

CSS background-clip: border-area

CSS background-clip: border-area 屬性將元素的背景剪輯到其邊框筆劃繪製的區域，border-widthborder-style同時忽略 的透明度border-color。

這啟用了沒有 的漸層邊框。border-image

另請參閱:

CSS image(<color>) 函數

CSS image() 函數使您能夠輕鬆地從任何顏色生成純色圖像。

例如，若要建立純紅色背景影像，請使用 background: image(red);。

另請參閱:

含影像值的 CSS light-dark()

CSS light-dark() 函數現在接受影像值 (url()、 、 image-set()none) 。

這使得根據用戶喜歡的配色方案在圖像之間自動切換成為可能。

您可以在 light-dark() 下列屬性中搭配影像值使用函數：

  • background-image
  • list-style-image
  • border-image-source
  • cursor
  • content

另請參閱:

逗點分隔的容器查詢

@container規則現在支援多個容器查詢，並以逗號分隔。 如果至少有一個查詢相符，則適用規則 @container 。

這可讓您對並非所有瀏覽器都支援的功能進行後援查詢。

例如:

@container --name1 not-supported(--foo: bar), --name2 (width > 600px) {}

另請參閱:

透過 CSS 公開無法列印的區域

使用 CSS page-margin-safety 屬性可避免嘗試列印到紙張上無法列印的區域。

印表機通常在一張紙張的四個邊緣各有一個小區域，印表機無法可靠地標記，這通常是由於印表機的紙張處理機制所致。

預設頁面邊界預期會大於這些紙張邊緣區域，但如果您在應用程式中設定邊界，而且想要新增 @page 邊界方塊 (，例如自訂頁首和頁尾) ，屬性則 page-margin-safety 提供一種檢測安全列印位置的方法。

另請參閱:

named-feature() CSS 函數 @supports

此 named-feature() 函式可讓 CSS @supports 規則查詢一小組特定的具名功能，這些功能無法使用其他 @supports 機制進行測試，但值得測試。

另請參閱:

overscroll-behavior: chain

overscroll-behavior CSS 屬性現在支援此chain值。

此屬性會影響兩個獨立的效果：

  • 捲軸傳播。
  • 局部框線效果 (，例如過度捲動拉伸) 。

先前， overscroll-behavior 有三個值：

  • none：無傳播，無局部影響。
  • auto：傳播，局部效果。
  • contain：無傳播，局部影響。

此功能會新增一個新值來完成集合：

  • chain：傳播，沒有局部影響。

另請參閱:

flex-wrap:balance

flex-wrap:balance 可讓您在每個 flex-line之間分配內容，讓版面配置看起來更平衡。

這與 類似。text-wrap:balance

另請參閱:

HTML 功能

Microsoft Edge 中包含下列新的 HTML 功能。

focusgroup 屬性

HTML focusgroup 屬性會標準化複合小工具的鍵盤導覽，例如工具列、索引標籤、功能表和選項群組。

focusgroup屬性會自動處理下列項目，而不需要自訂 JavaScript 程式碼：

  • 流動 tabindex 行為。
  • 透過方向鍵瀏覽。
  • 專注記憶;重新進入焦點群組時，還原最後焦點的元素。

例如:

<div focusgroup="toolbar wrap" aria-label="Formatting">
  <button>Bold</button>
  <button>Italic</button>
  <button>Underline</button>
</div>

另請參閱:

popover="hint" 屬性行為變更

具有屬性的 popover="hint" 元素行為已變更，以改善與元素的 popover="auto" 互動：開啟 popover="hint" 元素不會再無意中關閉不相關的 popover="auto" 元素。

以前，這兩種類型的彈出視窗元素之間的互動在某些情況下可能很複雜，例如元素內popover="hint"嵌popover="auto"套元素。

popover="hint" 現在只有當元素的祖先 popover="auto" 元素被隱藏，或者當開啟一個新的、不相關的 popover="auto" 元素時，才會隱藏。

此外，您現在可以安全地在元素內popover="hint"嵌套popover="auto"元素。 巢狀 popover="auto" 元素會以元素的形式 popover="hint" 運作。 這允許使用案例，例如在元素中popover="hint"放置可<select>自訂的元素。

另請參閱:

更新 <selectedcontent> 可自訂項目中的所有元素 <select>

在可<select>自訂的元素中定義多個<selectedcontent>元素時，所有元素現在都會使用目前選取的選項保持最新，而不是僅按 DOM 順序排列的第一個元素。

另請參閱:

串流不按順序排列 HTML

使用 <template for> HTML 元素以及 <?start> 和 <?end> 處理指令範圍來更新文件的現有部分，而不需要使用 JavaScript。

這項功能是針對 Web 上相同文件更新新增內建支援的更大計畫的一部分。

另請參閱:

Web API

Microsoft Edge 中包含下列新的 Web API 功能。

停用跨原始來源 iframe 和外掛程式上的 SVG 篩選器

SVG 篩選不再套用至下列項目：

  • 跨原始來源或受限制的 iframe (，例如沙箱化 iframe) 。
  • 內嵌外掛程式 (，例如 PDF) 。

這可防止透過 SVG 濾鏡效果處理跨原始來源內容時出現潛在的安全性問題。

另請參閱:

MediaStreamTrackProcessor 框架計數器

discardedFrames和totalFrames屬性現在可在介面上MediaStreamTrackProcessor使用。

這些計數器可讓您透過追蹤下列項目來監視媒體處理管線的健康情況：

  • 接收的框架數目。
  • 因系統資源限制而捨棄的畫面數目。

另請參閱:

URL 的 data: 不透明來源

從 URL 建立 data: 的專用 Worker 和共用 Worker 現在會指派唯一的不透明來源，而不是繼承建立者的來源。

這會使 Edge 與 HTML Standard 保持一致，並透過將這些背景工作角色與相同來源狀態隔離來改善安全性，BroadcastChannel例如 、 localStorage和 IndexedDB。

為了保留隔離邊界，這些背景工作角色會與其建立者 (保留在相同的儲存磁碟分割中，例如，依最上層網站或隨機數) 。

另請參閱:

PWA 來源移轉

Web 應用程式原始來源移轉可讓漸進式 Web 應用程式 (PWA) 移轉至新的原始來源，同時保留信任、安裝狀態和適用權限。

這可協助團隊安全地跨網域移動應用程式，而不需要強迫使用者重新安裝。

另請參閱:

在 和scrollTo方法完成時scrollBy收到通知

程式設計捲動方法，例如 scrollByscrollTo和 ，現在會傳回會在 Promise 捲動完成時解析的物件。 使用此 Promise 在平滑捲動完成之後執行程式碼，而不依賴計時器或捲動事件輪詢。

另請參閱:

Web 語音 API：在裝置上的辨識品質

SpeechRecognition介面現在支援此quality屬性。

此 quality 屬性可讓您指定使用 辨識所需的語意功能， processLocally: true也稱為裝置上 辨識。

屬性支援 quality 的值會對應至日益增加的工作複雜度和硬體需求：

  • command
  • dictation
  • conversation

使用屬性 quality ，您可以判斷裝置是否可以使用裝置上的辨識來處理您的使用案例，或您是否應該後援至雲端辨識服務。

另請參閱:

WebGPU：立即

WebGPU 現在支援即時。

此功能在 WGSL 中新增位址 immediate 空間， setImmediateData() 並在轉譯通道、計算通道和轉譯套件編碼器上新增方法。 您可以使用這些 API 將經常更新的小值傳遞至著色器，而不需要建立 GPU 緩衝區或繫結群組。

這對於每個繪製資料非常有用，例如物件索引、材料索引和轉換值。

另請參閱:

原始試用版

以下是可在 Microsoft Edge 中使用的新實驗性 API 的原始試用版。

原始試用版可讓您在限定的時間內，在自己的即時網站上嘗試實驗性 API。 若要深入了解原始試用版，請參閱在 Microsoft Edge 中使用原始試用版。

如需可用原始試用版的完整清單，請參閱 Microsoft Edge 原始試用版。

名稱 描述 登錄
提示 API 從您的網站或擴充功能 JavaScript 程式碼提示內建語言模型。 另請參閱 提示 API。 登錄
WebAssembly 自訂描述元 更有效率地將與來源層級類型相關聯的資料儲存在自訂描述元物件中。 登錄
軟瀏覽啟發學習法 公開軟瀏覽啟發學習法，以在單頁應用程式中收集效能計量。 登錄
WebNN 直接在 Web 應用程式中建置和執行硬體加速的機器學習模型。 登錄
CSP script-src 中的 URL 和評估雜湊 為 CSP 指示詞引入 script-src url 和 eval- 雜湊，取代基於主機名稱的允許清單和 unsafe-eval。 登錄
Web 安裝 API 允許網站使用 navigator.install()將另一個網站安裝為 Web 應用程式。 登錄
OpaqueRange 允許在內部<input><textarea>文字和元素上建立即時範圍，以在使用者編輯時自動更新。 這些範圍支援幾何方法，例如 getBoundingClientRect() CSS 自訂醒目提示 API，可直接在表單控制項上啟用插入號定位快顯視窗和內嵌拼字檢查等使用案例，而無需複製元素或公開內部 DOM 結構。 登錄
畫布中的 HTML 啟用使用新的繪圖方法和 paint 事件在畫布中呈現 HTML。 登錄
數位認證 API - 發行支援 觸發從憑證簽發者伺服器向數位錢包應用程式發行使用者憑證。 登錄
prerender_until_script 推測規則 API 動作 推測規則 API 動作，可預先轉譯頁面，但在指令碼執行時切換至預先擷取。 登錄
WebAudio 可設定轉譯 Quantum 可讓您在建立 AudioContext 或 OfflineAudioContext時指定自訂轉譯量子大小。 登錄
透過表單提交預先轉譯啟用 允許由表單提交啟用推測規則 API 中的預轉譯規則。 登錄
CPU 效能 API 公開使用者裝置功能的相關資訊，以與計算壓力 API 搭配使用。 登錄
連線允許清單 限制從文件或背景工作連線到伺服器散發的端點允許清單。 登錄
focus-without-user-activation 權限原則 透過 focus-without-user-activation 權限原則，讓內嵌程式控制內嵌內容中的程式設計焦點。 當框架的原則遭到拒絕時，除非由使用者啟用觸發，或焦點正在委派，否則會封鎖程式設計焦點呼叫 (element.focus()、 autofocus、 window.focus()dialog.showModal()及彈出視窗聚焦) 。 登錄
增強型畫布 TextMetrics 使用選取矩形、邊界方塊查詢和字符叢集作業擴展 TextMetrics Canvas API。 登錄
<usermedia> HTML 元素 瀏覽器控制的 HTML 元素，用於請求相機或麥克風存取，取代基於 JavaScript 的權限請求。 登錄
預先轉譯跨原始來源 iframe 透過選擇加入的回應標頭預先轉譯跨原始來源 iframe，而不是延遲到頁面啟用。 登錄
容器計時 監視何時顯示帶註解的 DOM 容器，並已完成其初始繪製。 登錄
在長動畫框架 API 中分開樣式和版面配置持續時間 新增 styleDuration、 forcedStyleDurationlayoutDuration和屬性以forcedLayoutDuration進行更深入的 CSS 效能分析。 登錄
提示 API 取樣參數 和temperature取樣參數可讓您topK最佳化每個語言模型工作階段的模型行為。 登錄
<install> HTML 元素 使用 element <install> ，以宣告方式將其他網站安裝為 Web 應用程式。 登錄
宣告式 CSS 模組指令碼 使用內嵌樣式模組與陰影根共用宣告式樣式表，包括宣告式陰影根。 登錄
遊戲控制器原始輸入事件 而不是依賴透過 navigator.getGamepads()的頻繁輪詢，網頁可以監聽 gamepadrawinputchanged 事件。 每當從相同裝置偵測到輸入框架之間的變更時，就會引發這些事件。 登錄
自動填滿事件 偵測瀏覽器自動填寫何時更新表單控制項，以調整自訂 UI 和驗證。 登錄
WebAssembly 自訂描述元 V2 更有效率地將與來源層級類型相關聯的資料儲存在自訂描述元物件中。 登錄
WebMCP 可讓您的網站註冊工具，讓瀏覽器內代理程式代表使用者完成工作。 登錄

注意事項

本頁面的部分內容是基於 Chromium.org 創建和共享的工作進行的修改，並根據知識共享署名 4.0 國際許可證中描述的條款使用。

  • Last updated on