下拉框需用配合实现，name和value必须显式设置；多选加multiple属性且name建议加[]后缀；禁用用disabled而非readonly。
用 <select></select> 和 <option></option> 组合实现下拉框
HTML 下拉选择框的核心就是 <select></select> 元素，它本身不显示选项，必须配合至少一个 <option></option> 才能生效。浏览器会自动把 <option></option> 渲染为可点击的下拉项。
常见错误是只写 <select></select> 没加 <option></option>，结果页面上只看到一个空空白框；或者把文字直接写在 <select></select> 标签里（如 <select>请选择</select>），这不会显示为默认提示——正确做法是用一个带 disabled 和 selected 的 <option></option> 作为占位提示：
<select name="city"><option value="" disabled selected>请选择城市</option> <option value="bj">北京</option> <option value="sh">上海</option></select>
name 和 value 必须配对使用才有效
表单提交时，后端收到的是 name=value 键值对，不是显示的文字内容。如果漏写 value，多数浏览器会把 <option></option> 内部文本当作值发送，但行为不可靠（比如含空格或特殊字符时可能被截断或编码异常）。
-
name属性必须设置，否则该字段不会随表单提交 - 每个
<option></option>都应显式声明value，哪怕和显示文本一样 - 避免用中文、空格或符号作
value，优先用英文小写+短横线（如value="user-active"）
多选下拉框要加 multiple 属性并注意交互差异
加了 multiple 后，用户可以按 Ctrl（Windows）或 Cmd（macOS）多选，但视觉上会变成固定高度的滚动列表，不再是“点击展开”的传统下拉样式——这是浏览器原生行为，无法仅靠 HTML 改变。
后端接收时，name 对应的值会变成数组（如 PHP 中 $_POST['hobbies'] 是数组），所以 name 名字建议加 [] 后缀（如 name="hobbies[]"）来明确语义，尤其在 PHP 等语言中更稳妥。
示例：
<select name="hobbies[]" multiple><option value="reading">阅读</option> <option value="swimming">游泳</option></select>
禁用某项或整个下拉框用 disabled，但别和 readonly 混用
<select></select> 不支持 readonly 属性，写了也无效；只有 disabled 能真正禁用交互并阻止提交该字段。如果只想禁用某一项，给对应 <option></option> 加 disabled 即可（它仍会显示，但不可选）。
- 整个下拉框禁用：
<select disabled></select> - 某一项禁用：
<option disabled value="unavailable">暂未开放</option> - 禁用的
<option></option>不会出现在提交数据中，即使它有selected
容易忽略的是：禁用的 <select></select> 在部分旧版 iOS Safari 中仍可能响应点击事件，如有 JS 监听，需额外判断 element.disabled 状态再执行逻辑。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
