ARIA:术语角色

term 角色可用于一个单词或短语,并带有一个可选的对应 definition

描述

term 角色可用于一个单词或短语,并带有一个可选的对应 definition。在语义上等效于 HTML <dfn> 元素和定义列表 (<dl> ) 中的定义术语 (<dt> ) 元素。

term 角色用于明确标识作者已提供或预期用户将提供的定义的单词或短语。如果存在现有定义或用于输入定义的表单或表单控件,则作者应将 aria-details 设置为指向相关元素。

不要在交互式元素(如链接)上使用 role="term",因为它可能会干扰辅助技术用户与元素交互的能力。此外,术语本身就是可访问名称,因此不要使用 aria-labelaria-labelledby

警告: 可访问名称应为术语本身,因此不要使用 aria-labelaria-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-labelaria-labelledby

首选 HTML

规范

规范
可访问富互联网应用程序 (WAI-ARIA)
# 术语

另请参阅