ios input 文本垂直偏移源于 webkit 对 line-height 和 height 解析不一致，核心解法是令二者严格相等（单位统一），禁用上下 padding，避免 flex 直接嵌套并单独修复 placeholder 偏移。
iOS 下 input 文本内容垂直偏移（常表现为文字贴顶、placeholder 上浮、与相邻元素不对齐），不是样式写漏了，而是 WebKit 渲染层对行高和内边距的解析逻辑不一致导致的。核心解法是强制对齐基准线，避开默认渲染抖动。
line-height 必须等于 height
这是最直接有效的 fix。iOS WebKit 会把 input 的文本基线锚点强行绑定到 line-height 区域，若 line-height 小于 height，文字就会上浮；大于则下沉。
-
height和line-height值必须完全相等（单位也要一致，推荐用px或统一upx） - 禁用
padding-top/padding-bottom，它们会干扰基线计算；如需内边距，只用padding-left和padding-right - 避免设置
vertical-align（除非明确设为middle，且父容器有明确高度）
避免 flex 容器中直接嵌套 input
当 input 放在 display: flex 的父容器里，且父容器设置了 align-items: center，iOS 可能忽略 input 自身的 line-height，改按 box-sizing + border-box 模式重新测算内容区——结果就是文字“悬空”。
- 解决方案：给
input外层再包一层<view></view>，该 wrapper 设为 flex 容器，input设为width: 100%并显式声明height和line-height - 不要对
input本身设flex: 1或align-self - 如果必须用 flex 对齐，父容器加
line-height: normal防止继承干扰
placeholder 偏上必须单独处理
即使正文对齐了，placeholder 在 iOS 低版本（如 iOS 14.x）仍可能上浮 2–4px，因为它的渲染走的是另一条路径。
- 给
input::placeholder单独加line-height: 1或具体像素值（如line-height: 24px） - 同时补
transform: translateY(0)强制触发重绘，绕过 WebKit 的 placeholder 基线 bug - 慎用
font-size缩放，iOS 下rem或vw单位易放大偏差
最麻烦的不是调参，而是不同 iOS 版本对 input 的 baseline 计算策略不一致：iOS 15.4 修复了部分 line-height 解析，但又让 transform 干扰更敏感。建议所有 H5 表单页都用固定 px 高度 + 显式 line-height，并用真机连 Safari 调试器逐版本验证基线位置。
