iOS Safari中select的size属性完全失效，点击触发全屏原生Picker，唯一可控方案是用div+button+ul自定义下拉，需设max-height、position:absolute、touchstart.preventDefault()及44×44px触控热区。
移动端 iOS Safari 强制全屏，size 属性基本失效
在 iOS Safari 中，<select> 点击后会跳转系统级全屏选择器（Picker），此时 size 属性完全被忽略，height、max-height、transform 也都无法影响弹出层。你写的 size="4" 在桌面 Chrome 里有效，到了 iPhone 上就变成全屏列表，且无滚动高度控制权。
想保留“点击展开”交互 + 限高？必须用自定义下拉
原生 <select> 在移动端就是黑盒，唯一出路是替换为 <div> + <button> + <ul> 结构：
-
<ul>必须设max-height: 200px和overflow-y: auto—— 这才是真生效的限高 - 父容器加
position: relative，<ul>用position: absolute; top: 100%定位，避免遮挡或错位 - 必须监听
touchstart并调用preventDefault()，否则 iOS 300ms 延迟会导致点击无响应 - 触控热区不能小于
44×44px：按钮高度设min-height: 44px，内边距补足，别靠transform: scale()压缩
Android 浏览器表现不一，但比 iOS 稍可控
Chrome for Android 和 Samsung Internet 多数仍走原生弹出菜单（非全屏），size 属性有一定效果，但：
-
size="5"可能显示 4–6 行，取决于系统字体和行高，无法像素级精确 -
appearance: none在部分 Android 版本中会破坏箭头渲染，导致无展开提示 - 若用
transform: scale()缩放，需同步加大font-size，否则文字模糊难读 - 务必测试 WebView 场景（如微信内置浏览器）：它常沿用 iOS 规则，强制全屏 Picker
无障碍和高对比模式不能漏
自定义下拉在移动端容易翻车的点不在高度，而在可访问性：
立即学习“前端免费学习笔记（深入）”；
- 没加
role="listbox"和每个<li>的role="option"+aria-selected，VoiceOver 就读不出选项 - 没监听
ArrowDown/Enter/Escape，键盘用户或开关控制设备无法操作 - Windows 高对比模式下，若
<ul>没设明确color和background-color，整个下拉可能变透明或纯黑 - 别用
visibility: hidden控制显隐——它不可动画，且屏幕阅读器无法感知状态变化
touchstart.preventDefault() 和 44px 热区这两关。 
