Safari中::placeholder偏上是因WebKit渲染层对行高继承逻辑异常，需用line-height:normal配合显式height和padding，并严格书写四前缀选择器。
为什么Safari里::placeholder总是偏上
因为 Safari（尤其是 16.3 及更早版本）对 ::-webkit-input-placeholder 的行高继承逻辑异常：它不严格继承 input 的 line-height: normal，而是按自身字体度量硬算基线，导致文字视觉上浮。这不是 bug，是 WebKit 渲染层的老行为，Chrome 和 Firefox 已优化，但 Safari 没跟进。
必须写全四个前缀选择器，且顺序不能错
只写 ::placeholder 在 Safari 15.3–16.3 下会失效——它根本不认这个标准语法。必须显式声明：
-
input::-webkit-input-placeholder（Safari/Chrome，必须保留） -
input::-moz-placeholder（Firefox，双冒号，opacity: 1必须带上） -
input:-ms-input-placeholder（IE11/旧 Edge，单冒号） -
input::placeholder（标准语法，放最后，否则被前缀覆盖）
漏掉任意一个，Safari 就可能回退到原生浅灰、偏上、字号不一致的默认样式。
line-height: normal 是 Safari 唯一靠谱的垂直居中方案
在 input 元素上设 line-height: normal，而不是给 ::placeholder 单独设数值。原因：normal 让浏览器按当前字体的真实 ascent/descent 自动计算行盒高度，避免 Safari 对固定 line-height: 48px 或 line-height: 1.2 的错误缩放。
立即学习“前端免费学习笔记（深入）”；
同时配合：
-
height显式设定（如height: 44px） -
padding均匀分配（如padding: 12px 16px） - 删掉
::placeholder里所有line-height、padding、vertical-align—— 这些属性在 Safari 下要么无效，要么加剧偏移
font-size 必须从 input 继承，别在 ::placeholder 里重写
一旦 input 设了 font-size: 16px，::placeholder 就不该再写 font-size。否则 Safari 会为占位符单独加载字体度量，基线立刻错位——输入文字居中，placeholder 偏上，形成“双轨错位”。
响应式场景下用 font-size: clamp(14px, 1rem, 16px) 也必须只写在 input 上；若用 rem，确保根元素 font-size 稳定，避免 Safari 对 rem 的小数解析抖动。
真机调试时最容易忽略的是：Safari 的字体渲染受系统深色模式、辅助功能（更大字体）影响，font-size 实际生效值可能浮动。所以别依赖像素级对齐，留 1–2px 视觉容差更实际。
