ARIA:標記角色
mark 角色表示由於內容在封閉上下文中的相關性,而為了參考或註釋目的而被標記或突出顯示的內容。
描述
mark 角色在語義上表示包含被標記/突出顯示以供參考的文字的 HTML 元素。這在語義上等效於 HTML <mark> 元素。如果可能,您應該使用此元素代替。
mark 的示例用例與 <mark> 元素完全相同。它們包括突出顯示引文中特別感興趣但未在原始源材料中標記的文字,類似於使用熒光筆標記印刷文章中的段落,以及指示與使用者當前活動相關的部分內容,例如突出顯示搜尋功能找到的文字匹配項。
不要將 mark 用於純粹的裝飾性樣式,例如語法高亮顯示。
mark 元素不應被賦予可訪問名稱;aria-label 和 aria-labelledby 屬性在 mark 上都被禁止。
示例
在以下示例中,我們有一個已添加註釋的文件部分。已註釋的部分使用 <span role="mark"> 標記。
html
<p>
The last half of the song is a slow-rising crescendo that peaks at the
<span role="mark" aria-details="thread-1">end of the guitar solo</span>,
before fading away sharply.
</p>
<div role="comment" id="thread-1" data-author="chris">
<h3>Chris said</h3>
<p class="comment-text">I really think this moment could use more cowbell.</p>
<p><time datetime="2022-03-30T19:29">March 30 2022, 19:29</time></p>
</div>
相關注釋使用 HTML 結構標記,該結構包含一個 <div>,其中包含 role="comment"。
為了將註釋與正在註釋的文字關聯起來,我們需要用包含 aria-details 屬性的元素包裝已註釋的文字,該屬性的值應為註釋的 ID。
最佳實踐
優先使用 HTML
使用 <mark> 元素將自動傳達節點具有 mark 角色。如果可能,請優先使用它。
規範
將成為 WAI-ARIA 1.3 的一部分,該規範仍在起草中。
另請參見
- HTML
<mark>元素