html-select-and-option

Introduction

<select> is a form control element that allows users to select an option from a list of options. It is used to create a drop-down list. <option> is a child element of <select>, which represents an option in a drop-down list.

Example

<select id="my_select">
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
</select>

Default value

You can set default value to a select by adding selected to the option element.

<select id="my_select">
  <option value="1">1</option>
  <option value="2" selected>2</option> <!-- default value -->
  <option value="3">3</option>
</select>

Use ul/li to create a select list

Its 2024 now, I still can’t set styles to option like padding and margin. The only way to create a custom select list is to use ul and li elements.

<ul id="my_select">
  <li value="1">1</li>
  <li value="2">2</li>
  <li value="3">3</li>
</ul>

Reference

https://stackoverflow.com/a/22681234/1487475

未完，待续。。。