iOS Safari对特定input类型内置私有内边距且与font-size耦合，必须加-webkit-appearance: none才能重置样式，否则padding等声明无效；还需显式设置box-sizing: border-box并精准清除各类型默认样式。
为什么iOS上input的padding看起来“多了一截”
不是你写错了，是iOS Safari对input[type="date"]、input[type="number"]等控件内置了私有内边距（比如-webkit-padding-start: 8px），且这些值无法被普通padding覆盖。更麻烦的是，它们还和font-size、line-height耦合——哪怕你写了padding: 0，文字仍可能偏上或被裁。
必须加-webkit-appearance: none才能真正接管样式
这是解锁重置权限的第一步。不加这句，iOS会坚持用系统原生渲染逻辑，你的padding、border甚至height都可能被忽略或二次计算。
-
-webkit-appearance: none要显式写在所有需重置的表单控件上，包括input、select、textarea - 加完后务必补
box-sizing: border-box，否则padding会撑宽控件 - 部分iOS版本对
select加none后下拉箭头消失，得自己用::after模拟
重置padding不能只靠* { padding: 0 }
通配符对iOS无效——它的默认padding来自UA样式表里的input:-webkit-search-decoration这类隐藏选择器，*根本匹配不到。得精准打击：
- 针对
input：写input { padding: 0; margin: 0; }，别依赖继承 - 特别处理
input[type="search"]：它自带-webkit-search-cancel-button，需额外清空：input[type="search"]::-webkit-search-cancel-button { appearance: none; } -
textarea在iOS中默认有padding: 2px 4px，且resize控件占位，建议统一设padding: 12px 16px并禁用resize: none
viewport缺失会导致“假外边距”干扰判断
很多人以为左右空白是CSS问题，其实是没加<meta name="viewport" content="width=device-width, initial-scale=1">，导致页面被缩放后露出背景色。这个“外边距”根本不在DOM里，查不到、清不掉。
立即学习“前端免费学习笔记（深入）”；
真要调表单间距，先确认这个meta标签存在；再检查是否误把body的margin当成了input的外边距——iOS上body默认margin: 8px，但现代项目通常已重置，别让它背锅。
