共用方式為


使用無障礙標籤測試無障礙

無障礙標籤是您可以查看 DOM 節點的無障礙樹、ARIA 屬性及計算出的無障礙屬性的地方。

要開啟 無障礙 標籤:

  1. 在渲染的網頁中,右鍵點擊一個元素,然後選擇 檢查

    DevTools 開啟,選取 Elements 工具。 DOM 樹會打開,顯示你右鍵點擊的元素。

  2. DOM 樹中,點選你想檢查的元素。 你可以用方向鍵在 DOM 樹中移動。

  3. 點擊樣標籤右邊的「無障礙」標籤。你可能需要先點擊「更多」分頁 (「更多」分頁按鈕,位於樣式標籤右邊的「更多」分頁按鈕) 。

Elements 工具側邊欄面板的無障礙標籤

查看元素在無障礙樹中的位置

無障礙樹是 DOM 樹的子集。 無障礙樹僅包含來自 DOM 樹中,對於透過螢幕閱讀器等輔助技術顯示頁面內容相關且有用的元素。

無障礙 標籤籤檢查某個元素在無障礙樹中的位置。

無障礙樹區

查看元素的 ARIA 屬性

ARIA 屬性確保輔助技術如螢幕閱讀器擁有所有正確呈現頁面內容所需的資訊。

「無障礙 」標籤中查看元素的 ARIA 屬性。

ARIA 屬性區塊

查看元素的計算可達性屬性

部分無障礙屬性會由瀏覽器動態計算。 這些屬性會顯示在無障礙標籤的計算屬性區塊中。

「無障礙 」標籤中查看元素的計算無障礙屬性。

無障礙標籤中的「計算屬性」區塊

計算出的可及性屬性與計算出的 CSS 屬性不同。 欲了解更多如何查看計算出的 CSS 屬性,請參閱「 僅檢視實際應用於CSS 特徵元素的 CSS」。

注意事項

本頁部分內容基於 Google 創作與 分享 的作品,並依 據創用CC 姓名標示 4.0 國際授權條款進行修改。 原始頁面 可在此找到 ,作者為 Kayce Basques。

創用CC授權 本作品採用 創用CC 姓名標示4.0國際授權條款授權。