关键是用标准 autocomplete 值让浏览器精准自动填充：邮箱用 email，手机号用 tel，地址用 street-address 和 address-line2，邮编用 postal-code，生日需 type="date" + bday，且 type/name/autocomplete 三者语义一致。
核心是让浏览器“看懂”字段意图，并在用户手指刚点进输入框时，就弹出准确建议——这比任何提示文案都管用。移动端屏幕小、操作成本高，一次填错或手动切换键盘就可能直接关页。
用对 autocomplete 值，让 Safari 和 Chrome 都愿意填
浏览器只认 WHATWG 规范里的标准 token，大小写、连字符、拼写错一个都不行：
- 邮箱必须写 autocomplete="email"，不是 "user-email" 或 "Email"
- 手机号用 autocomplete="tel"，搭配 type="tel" 才能唤出数字键盘和 *# 符号
- 地址第一行写 autocomplete="street-address"，第二行写 autocomplete="address-line2"（注意是 line2，不是 line-2）
- 邮编用 autocomplete="postal-code"，"zip" 或 "postcode" 完全无效
- 生日字段必须是 type="date" autocomplete="bday"，type="text" 再配 bday 也没用
type + name + autocomplete 三者必须语义一致
缺一不可，尤其在 Safari 上，name 不标准会直接放弃填充：
Convert Markdown To HTML And PDF - Markdown和HTML、PDF互转
下载
实现 Markdown↔ HTML 互转，支持导出 PDF，用于用户请求的文档格式转换。
- 邮箱字段：type="email" name="email" autocomplete="email">
- 姓名字段：type="text" name="name" autocomplete="name">（不拆 first/last 更稳妥）
- 信用卡号：type="text" name="cc_number" autocomplete="cc-number">（注意 name 用下划线，autocomplete 用短横线）
- 避免 type="text" 却配 autocomplete="email"——浏览器优先信 type，会跳过自动填充
移动端专属优化细节
针对软键盘、遮挡、触控等真实场景做微调：
立即学习“前端免费学习笔记（深入）”；
- 加 inputmode="email" 或 inputmode="numeric"，比仅靠 type 更可靠地唤出对应键盘
- 确保 label 显式关联（
- 所有可点击元素（按钮、单选/复选框）点击区域不小于 44×44px，避免误触后退出表单
- 地址类字段配合地理定位 API 自动填充初值，再让用户微调，比从零填写流失率低 60% 以上
- 密码字段严格区分：autocomplete="current-password"（登录），autocomplete="new-password"（注册或改密）
避开那些“看似合理实则致命”的坑
很多表单失效，不是没写 autocomplete，而是被其他设置悄悄关掉了：
- 整个 form 写了 autocomplete="off"？现代浏览器虽已弱化处理，但仍会影响 Safari 的判断
- 字段是 JS 动态插入的（如 React 的 {show && }）？浏览器初始化时根本没扫描到它，填不了
- input 被设为 display: none 或初始 value 被 JS 清空？填充时机被破坏，建议用 visibility: hidden + opacity: 0 替代隐藏
- 同一页面两个字段都写 autocomplete="tel"？浏览器随机选一个填，用户看到的可能是错的号码
