旧版chromium（v55–v74）不支持offset-path，因其css动画引擎未实现该规范，属原生功能缺失，非配置错误所致。
旧版 Chromium（如 v55–v74）根本不支持 offset-path，强行启用只会静默失效——这不是配置问题，是引擎级缺失。
为什么 Chrome offset-path 一定不生效
该属性从 Chromium 75（2019 年中）才开始实验性支持，v55 属于 2016 年底的内核，连解析 offset-path 的 CSSOM 属性名都不存在。浏览器遇到不认识的属性会直接丢弃整条声明，控制台无报错，元素也不动，容易误判为“写法错了”。
-
getComputedStyle(el).offsetPath在 v55 中返回undefined，不是空字符串 -
@supports (offset-path: path(''))检测结果恒为false，且无法 fallback 触发 - 即使加了
-webkit-前缀也无效——该属性从未进入 WebKit/Blink 实验前缀阶段
真能跑在 v55 上的路径动画替代方案
必须放弃 CSS 原生路径动画，改用 JS + transform: translate() 手动插值。核心是把 SVG 路径转成点序列，再逐帧计算位置：
- 用
document.querySelector('#myPath').getTotalLength()获取路径总长（v55 支持） - 用
document.querySelector('#myPath').getPointAtLength(pos)计算任意长度处坐标（v55 已支持） - 用
requestAnimationFrame驱动，每帧调用el.style.transform = `translate(${x}px, ${y}px)` - 方向对齐需额外计算切线角：两次调用
getPointAtLength（如pos和pos + 1），用Math.atan2(dy, dx)得角度
v55 下写 path 字符串的兼容红线
别试图在 v55 中“模拟”offset-path 行为——所有依赖它的 CSS 动画、offset-distance、offset-rotate 全部不可用。但如果你仍需在 HTML 中定义路径（比如供 JS 解析），注意：
- 只用绝对指令：
M,L,C,Q；禁用m,l,c（v55 对相对路径解析不稳定） - 空格必须存在：
path("M 10 10 C 20 20 30 20 40 10")可用，path("M10,10C20,20,30,20,40,10")在 v55 中可能报错或跳点 - Y 轴向下为正，若路径来自设计稿（Y 向上），需手动翻转：把
y替换为-y
真正卡住多数人的不是技术实现，而是忘了 v55 连 Promise 都不支持——JS 插值逻辑得用回调或 polyfill，且不能依赖现代 DOM API 返回类型。动手前先确认你的目标环境是否真的绕不开 v55；如果是内网老系统，往往比强推路径动画更务实的做法，是换一条不依赖路径的交互动线。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
