ARIA: math 角色

描述

具有 math 角色的内容旨在以可访问的格式进行标记，例如 MathML，或者使用另一种可以被浏览器或 polyfill 库转换为可访问格式的文本表示形式。

遗憾的是，浏览器对 MathML 的支持并非普遍。虽然使用数学表达式的图像并非最佳选择，但如果您确实使用了图像，请使用 math 角色。请确保所有数学图像都通过 alt 属性进行标记，该属性应描述数学表达式的口头表达方式。

如果 math 元素只有展示性的子元素，并且可访问名称旨在传达数学表达式，请使用 aria-label 提供表示该表达式的字符串。如果 math 元素包含传达数学表达式的可导航内容，并且存在该表达式的可见标签，请使用 aria-labelledby。否则，请使用 aria-label 来命名表达式，例如 aria-label="毕达哥拉斯定理"。

示例

如果您使用图像或非语义 HTML 来创建公式，请使用 math 角色。

上面的毕达哥拉斯定理以可访问的方式书写为：

<div role="math" aria-label="a^{2} + b^{2} = c^{2}">
  a<sup>2</sup> + b<sup>2</sup> = c<sup>2</sup>
</div>

如果使用了图像，则 alt 属性将与 math 角色一起使用。

<img src="pythagorean_theorem.gif" alt="a^{2} + b^{2} = c^{2}" role="math" />

规范

另见

• MDN 上的 MathML 和 <math> 元素（非 HTML）
• MathML 规范