WAI-ARIA: Role=Listitem
Description
A single item in a list or directory.
Authors MUST ensure elements with role listitem are contained in, or owned by, an element with the role list or group.
ROle=Listitem Example
Pseudo-list with โlistโ and โlist-itemโ roles
- list: A group of non-interactive list items
- listitem: A single item in a list or directory
<div role="list">
<div role="listitem">dog</div>
<div role="listitem">cat</div>
<div role="listitem">sparrow</div>
<div role="listitem">wolf!</div>
</div>
Characteristics
Superclass Role
- section
Subclass Roles
- treeitem
- Base Concept:
- HTML li
Required Context Role
- group
- list
Supported States and Properties
- aria-level
- aria-posinset
- aria-setsize
Inherited States and Properties
- aria-atomic
- aria-busy (state)
- aria-controls
- aria-current (state)
- aria-describedby
- aria-details
- aria-disabled (state)
- aria-dropeffect
- aria-errormessage
- aria-expanded (state)
- aria-flowto
- aria-grabbed (state)
- aria-haspopup
- aria-hidden (state)
- aria-invalid (state)
- aria-keyshortcuts
- aria-label
- aria-labelledby
- aria-live
- aria-owns
- aria-relevant
- aria-roledescription
Name From
- author
Semantic HTML
Use the HTML <li> tag for <ol> and <ul>. Use <dt> for <dl>.
<ol>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol>
<ul>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
<dl>
<dt>Coffee</dt>
<dd>Black hot drink</dd>
<dt>Milk</dt>
<dd>White cold drink</dd>
</dl>
Reference
- WAI-ARIA 1.2 Specification
Refer to the notes from the WAI-ARIA 1.2 specification for more information on role=listitem.