描述
term 角色可用於表示一個單詞或短語,並可選擇性地關聯一個 definition 角色。它在語義上等同於 HTML 中的 <dfn> 元素,以及定義列表(<dl>)中的定義術語(<dt>)元素。
term 角色用於明確標識一個單詞或短語,該單詞或短語已由作者提供定義,或使用者期望提供定義。如果已存在定義,或存在用於輸入定義的表單或表單控制元件,作者應設定 aria-details 指向相關元素。
請勿在連結等互動式元素上使用 role="term",因為它會干擾輔助技術使用者與元素的互動能力。此外,術語本身就是可訪問名稱,因此請勿使用 aria-label 或 aria-labelledby。
警告: 可訪問名稱應該是術語本身,因此請勿使用 aria-label 或 aria-labelledby。
關聯的 WAI-ARIA 角色、狀態和屬性
無。
鍵盤互動
無。
所需的 JavaScript 功能
無。
示例
html
<p>
<span role="term">Mansplaining</span>,
<span role="definition"
>a portmanteau of "man" and "explain", is the patronizing act of explaining
without being asked to do so, to someone already learned on the topic, often
after someone has already explained it</span
>.
</p>
包含更好的語義,上述內容也可以寫成
html
<p>
<dfn role="term">Mansplaining</dfn>,
<span role="definition"
>a portmanteau of "man" and "explain", is the patronizing act of explaining
without being asked to do so, to someone already learned on the topic, often
after someone has already explained it</span
>.
</p>
或者不使用任何 ARIA(但可能不是你想要呈現的方式)
html
<dl>
<dt>Mansplaining</dt>
<dd>
A portmanteau of "man" and "explain", is the patronizing act of explaining
without being asked to do so, to someone already learned on the topic, often
after someone has already explained it.
</dd>
</dl>
可訪問性考慮
請勿在連結等互動式元素上使用 role="term",因為它會干擾輔助技術使用者與元素的互動能力。
最佳實踐
讓術語本身來定義可訪問名稱。請勿使用 aria-label 或 aria-labelledby。
規範
| 規範 |
|---|
| 無障礙富網際網路應用程式 (WAI-ARIA) # term |
另見
- ARIA:
definition角色. - HTML
<dfn>元素