aria-current

元素上的非空 aria-current 狀態表示此元素代表容器或一組相關元素中的當前項。

描述

當您有一組相關元素時，例如麵包屑中的幾個連結或多步驟流程中的步驟，其中一個元素在組中與其他元素的樣式不同，以指示有視力的使用者這是其組中的當前元素，則應使用 aria-current 通知輔助技術使用者透過樣式指示的內容。

在麵包屑列表中，當一組分頁連結中的連結的樣式指示使用者當前位於該頁面時，應在該連結上設定 aria-current="page"。在具有步驟指示器（例如多頁調查或多步驟結賬或註冊流程）的多步驟流程中，噹噹前步驟圖示在視覺上有所不同以表示它是當前步驟時，該圖示的容器應具有 aria-current="step"，以便無法“看到”視覺差異的輔助技術使用者可以使用。

aria-current 屬性將設定為非 false 值的元素指示為容器或一組相關元素中的當前項。僅使用 aria-current 將一組元素中的一個元素標記為當前。

aria-current 屬性接受有限的值列表，包括 page、step、location、date、time、true 和 false。此列舉值列表中未包含的任何非空字串值都將被視為已設定 aria-current="true"，而不是預設的 false 值。如果屬性不存在、為空字串、存在但沒有值或設定為 aria-current="false"，則不會將其公開給使用者。

當選擇某些內容而不是當前內容時，例如tab 在tablist 中，使用aria-selected 指示當前顯示的 tabpanel。

注意：不要使用 aria-current 作為aria-selected 的替代品，在gridcell、option、row 或tab 中。

示例

“當前頁面”的麵包屑應在其上設定 aria-current="page"。

html

<nav aria-label="Breadcrumb" class="breadcrumb">
  <ol>
    <li>
      <a href="../../../../../">Web technology for developers</a>
    </li>
    <li>
      <a href="../../../../">Accessibility</a>
    </li>
    <li>
      <a href="../../../">ARIA</a>
    </li>
    <li>
      <a href="../../">ARIA States and Properties</a>
    </li>
    <li>
      <a href="./" aria-current="page">ARIA: `aria-current` attribute</a>
    </li>
  </ol>
</nav>