size≥2时select变为常驻多行列表框，非下拉式；需加multiple才支持多选；iOS及WebKit内核浏览器会忽略size>1，建议用ARIA自定义或设size≥3避坑。
size属性设为2及以上时，select就自动变成列表选择框
只要写 size="2" 或更大的整数，浏览器就会把 <select> 渲染成固定高度、始终展开的多行列表控件——不是“下拉后变列表”，而是根本不再有下拉动作，选项直接常驻可见。
它和传统下拉框是两种渲染模式：size=1（或未设）走的是“popup”语义；size≥2 走的是 “listbox” 语义，键盘操作、焦点管理、屏幕阅读器识别全都不一样。
-
size="1"和没写size效果完全一致，仍是单行下拉按钮 -
size="0"、空字符串或负数会被浏览器忽略，回退到默认行为（即 size=1） - 显示行数 =
size值，超出部分自动出现垂直滚动条，不会撑开容器 - 文字换行或截断取决于 CSS 的
line-height、padding和字体大小，不是 size 控制的
想多选？必须显式加 multiple 属性
只写 size="4"，哪怕显示4行，点击仍只会切换当前选中项——它还是单选。这是最常踩的坑：误以为“显示多行 = 可多选”。
真正支持 Ctrl/Cmd + 点击或多选交互，必须同时写 multiple：
立即学习“前端免费学习笔记（深入）”；
<select size="4" multiple> <option value="a">A</option> <option value="b">B</option> <option value="c">C</option> <option value="d">D</option> </select>
- 没
multiple→ 单选，方向键上下切换 + 回车确认，行为接近 radio 列表 - 有
multiple→ 多选，支持 Ctrl/Cmd + 点击、Shift + 方向键连续选 - 后端接收时，
name最好带[]（如name="tag[]"），否则 PHP/Python 等可能只收到最后一个值
iOS Safari 和微信/QQ 浏览器会静默忽略 size > 1
这不是 bug，是 WebKit 内核的强制降级策略：在移动端（尤其是 iOS 全系 + 所有基于 WebKit 的国内壳浏览器），size="3" 或 size="4" 大概率被无视，回退为原生单行下拉选择器。
这意味着你写的列表样式，在真机上很可能完全不生效。
- 测试必须用 iOS 真机，模拟器不可靠
- 若产品强依赖多行可见 + 多选，建议放弃原生
<select>，改用<div role="listbox">+ ARIA 实现 - 折中方案：用 JS 在 focus 时临时设
size，blur 时还原，但 iOS 的blur事件常不触发，需补touchend或setTimeout
动态改 size 容易视觉突兀，且 Chrome/Safari 渲染不稳定
想实现“点击展开为列表、失焦收起”，很多人用 JS 切换 size 值。但实际体验差：没有过渡动画，高度硬切换，可能闪动或错位。
更麻烦的是，Chrome 和 Safari 对 size="2" 渲染特别敏感——缩放页面、调整字体大小、甚至系统 DPI 设置稍有变化，就可能截断最后一行或留出空白行。
- 推荐最小设
size="3"，避开size="2"的兼容性雷区 - 如果选项总数少于
size值，多余行留白，不会自动收缩；想贴合内容高度，得用 JS 动态计算option数量再赋值 - 别指望它模拟原生下拉动画——
size是 DOM 属性切换，不是 CSS 过渡，视觉上就是“啪一下变高”
真正麻烦的从来不是怎么写 size="4"，而是你写了之后，不知道它在哪台设备上悄悄失效了。
