Dropdowns are built with
<details role="list"> as a wrapper and
<ul> as direct children.
For style consistency with the form elements, dropdowns are styled like a <select> by default.
<summary role="button"> transforms the dropdown into a button.
Dropdown as a button 1
Dropdown as a button 2
Dropdown as a button 3
Dropdowns can be used as custom selects with
<input type="radio"> or
Select single element
Select multiple elements
Dropdowns can be used inside a <nav> with a nested
Example with a dropdown as a link:
Example with a default dropdown and a dropdown as a button:
You can also use
<li role="list"> as a nested wrapper to render a list as a dropdown.
ℹ️ This syntax is experimental. In this version, the dropdown menu is triggered on hover.