Explains how to unlock full control of styling select menus on the web.
The HTML select element is getting a major upgrade with a new CSS appearance value, and new pseudo-elements.
Covers how the select options can contain rich content with new possibilities in HTML.
Build selects that match the design system, while keeping all the accessibility and robustness of the default element.
The session moves through Style the select button, Customize the drop-down, Go beyond text options, The selectedcontent element, Fallback for unsupported browsers.
Key concepts include HTML select, HTML, Safari, JavaScript.
Condensed Flow
01
Go beyond text options:
Focuses on JavaScript.
02
The selectedcontent element:
Focuses on JavaScript.
More Detail
Additional details
Detailed flow: Style the select button -> Customize the drop-down -> Go beyond text options -> The selectedcontent element -> Fallback for unsupported browsers.
APIs and concepts to recognize: HTML select, HTML, Safari, JavaScript.