iOS Safari 中 transition 失效主因是作用于不支持硬件加速的属性（如 height、margin），应改用 transform/opacity 并加 translateZ(0) 或 will-change，删 -webkit- 前缀，避免 layout 触发重排。
transition 在 iOS Safari 里完全没反应
多数情况是 transition 作用在了不支持硬件加速的属性上，比如 height、margin、background-position。iOS WebKit 对这些属性的过渡做了限制，即使写了 transition: height 0.3s，也大概率静默失败。
实操建议：
立即学习“前端免费学习笔记（深入）”；
- 优先用
transform+opacity替代：比如展开菜单改用transform: scaleY(1)而非height: auto - 强制开启 GPU 加速：给过渡元素加
transform: translateZ(0)或will-change: transform（注意will-change别滥用，仅在真正需要时设置） - 确认触发时机：移动端没有 :hover，别依赖 hover 触发 transition；改用 class 切换或 JavaScript
element.classList.toggle()
加了 -webkit-transition 还是不动
加前缀只是历史兼容手段，现代 iOS（13+）已原生支持无前缀 transition。盲目加 -webkit-transition 不但无效，还可能因浏览器解析优先级混乱导致行为异常。
实操建议：
立即学习“前端免费学习笔记（深入）”；
- 删掉所有
-webkit-transition，只保留标准写法transition: transform 0.25s ease - 检查是否被其他 CSS 覆盖：用 Safari 开发者工具（连接 Mac 的「开发」菜单）看 computed 样式里
transition是否被标为 strike-through - 确认 transition-property 没写错别字，比如把
tranform写成transform少个n，这种低级错误在真机上不会报错，只会静默失效
transition-delay 在点击后延迟不生效
移动端点击存在约 300ms 的延迟（尤其未启用 viewport 优化时），容易让人误以为 transition-delay 没起作用。更常见的是：JS 点击事件中直接修改 class，但样式计算尚未完成，导致 transition 被跳过。
