ARIA：aria-details 屬性

描述

aria-details 屬性可用於為物件提供額外資訊或複雜描述。它透過提供更深入的資訊來告知輔助技術使用者有關內容的資訊，無論這些內容是當前文件的一部分還是指向其他資源的連結。

還有其他 HTML 和 WAI-ARIA 屬性具有類似目的。HTML <label> 元素以及 aria-label 和 aria-labelledby 屬性用於為物件提供簡短的標籤。HTML title 屬性以及 aria-description 和 aria-describedby 屬性提供了關於物件的更長的純文字描述。但是，當物件需要額外資訊、複雜描述或可導航內容並且這些內容可用時，應使用 aria-details 屬性。

aria-details 屬性的作用類似於 HTML 中從未完全支援的 longdesc 屬性，該屬性指定了一個指向替換元素內容的長描述的 URL，但由於缺乏支援和濫用而被棄用。

aria-details 屬性的值是用於獲取更詳細資訊的元素的 id，或者是由空格分隔的 id 列表。當一個元素包含 aria-details 時，輔助技術會告知使用者擴充套件資訊的可用性，使使用者能夠導航到引用的內容。

由 aria-details 引用的元素旨在包含比通常透過 aria-describedby 提供的更多資訊。

由 aria-details 引用的元素應向所有使用者可見。aria-details 告知使用者，否則可能無法快速掃描螢幕的使用者，解釋性內容是可用的。

注意： aria-details 對可訪問描述沒有影響。

與 aria-describedby 不同，由 aria-details 引用的元素不用於可訪問描述，在呈現給輔助技術使用者時也不會被轉換為純文字字串。如果關聯內容不長，並且將引用元素的內容展平為簡單的文字字串不會導致資訊丟失，請考慮使用 aria-describedby。也就是說，一個元素可以同時擁有 aria-details 以及使用 aria-describedby 或 aria-description 指定的描述。

示例

對於定義和術語角色，aria-details 將包含在 term 元素上，其值為具有 definition 角色的元素的 id。

html

<p>
  The <strong>cubic-bezier()</strong> functional notation defines a cubic
  <span role="term" aria-details="bezier bezImg">Bézier curve</span>. As these
  curves are continuous, they are often used to smooth down the start and end of
  the curve and are therefore sometimes called easing functions.
</p>

<p role="definition" id="bezier">
  A <strong>Bézier curve</strong>, (Pronounced \ ˈbe-zē-ˌā \)
  <i aria-description="English pronunciation">BEH-zee-ay</i>) is a
  mathematically described curve used in computer graphics and animation. The
  curve is defined by a set of control points with a minimum of two. Web related
  graphics and animations use Cubic Béziers, which are curves with four control
  points P<sub>0</sub>, P<sub>1</sub>, P<sub>2</sub>, and P<sub>3</sub>.
</p>

<a
  href="bezierExplanation.html"
  id="bezImg"
  aria-label="Explanation of Bézier curve in CSS easing functions">
  <img alt="Animated Bézier curve showing 4 control points." src="bezier.gif" />
</a>