0Pricing
HTML Academy · Lesson

The selectlist Element

Customize dropdown controls with the proposed selectlist element.

The Long-Standing Limitation

The <select> element is one of the only form controls whose appearance cannot be styled. Every CSS rule applied to it (custom borders, fonts, option styles) is ignored by the browser, leading to thousands of "custom dropdown" libraries duplicating native behavior just to get styled options.

What selectlist Is

<selectlist> (also seen as <selectmenu>) is a native HTML element designed as a stylable replacement for <select>. It accepts the same conceptual model — a button trigger and a list of options — but every part is exposed for CSS customization.

<selectlist>
  <option>Apple</option>
  <option>Banana</option>
  <option>Cherry</option>
</selectlist>

All lessons in this course

  1. Declarative Shadow DOM
  2. The Popover API
  3. The selectlist Element
  4. Interest Invokers and Command Attribute
← Back to HTML Academy