原生无法通过css控制滚动条区域，size属性是唯一稳定控制可见行数的方案；需用自定义才能精确控制高度与样式，同时须保留隐藏原生select以保障表单功能及无障碍支持。
原生 <select></select> 的滚动条区域根本设不了
你给 <select></select> 加 max-height、overflow-y: auto 或者给 <option></option> 设 height，浏览器全当没看见。因为下拉弹出菜单是脱离 DOM 的系统级 UI（Windows 用 ComboBox，macOS 用 NSPopUpButton，iOS 强制全屏），CSS 根本穿不透。你在 DevTools 里看到的滚动条，其实是操作系统画的，不是你的样式。
size 属性是唯一能稳定控制可见行数的原生方案
它不靠 CSS，而是告诉浏览器“展开时默认显示几行”，浏览器据此计算弹出区域高度并自动加滚动条——这才是真生效的限高逻辑。
Article To Html
下载
文章转信息图。将文章/笔记转化为手机可读的 HTML 信息图，自动匹配视觉风格。触发场景：文章转图、笔记转图、信息图、转小红书图、做张图、可视化这篇文章、文生图。
-
size="4"→ 展开后固定显示 4 行，超出即滚动，高度 ≈ 4 × 系统默认行高（通常 24–28px） -
size="1"等效于默认下拉行为，但某些旧版 Safari 可能丢箭头，慎用 - 别和
multiple混用除非真要多选；移动端（尤其 iOS）可能无视size，强制走全屏选择器
要真正自由控制滚动条区域高度，必须用 <div> + <code><ul></ul> 自定义
放弃原生 <select></select> 后，滚动容器就是你手里的 <ul></ul>，所有尺寸都可精确干预：
- 给
<ul></ul>设max-height: 200px+overflow-y: auto，高度完全可控 - 每项
<li>可设height: 40px、line-height: 40px或display: flex; align-items: center，垂直居中稳如磐石 - 必须保留原生
<select></select>在 DOM 中（position: absolute; opacity: 0; pointer-events: none;），同步更新value和selectedIndex，否则表单提交失效 - 滚动条样式可用
::-webkit-scrollbar微调，但别指望 Firefox/IE 支持
移动端和无障碍最容易翻车的点
iOS Safari 要求触控热区 ≥ 44×44px，自定义下拉按钮若小于这个尺寸，用户点不中；Chrome 120+ 会对缩放或透明覆盖的表单控件报可访问性警告。而如果你漏掉 aria-expanded、role="listbox" 或键盘事件（ArrowDown/Escape），屏幕阅读器用户就等于看不见这个下拉框。
