animation-fill-mode:forwards未生效的主因是@keyframes缺少100%关键帧或被display:none等样式覆盖；需显式定义末帧、避免强制隐藏、检查样式优先级，并注意JS直接赋值会覆盖CSS动画末帧。

animation-direction取值为normal、reverse、alternate、alternate-reverse，分别控制动画每轮的播放方向逻辑；设reverse无变化常因关键帧定义未适配倒播顺序。

CSS动画通过animationstart、animationend、animationiteration事件触发JS响应，需确保元素已渲染且样式生效；重播需强制回流；复杂交互推荐element.animate()；防重复触发应检查getAnimations()状态。

transform-origin的默认值是50%50%，即元素盒模型的几何中心；若元素存在padding、border、裁剪或定位偏移，视觉中心与几何中心不一致，会导致旋转“歪了”。

hover动画鼠标移入无反应常见因父元素pointer-events:none或子元素display:none；focus动画需元素可聚焦（如加tabindex="0"）；hover与focus可共存但须注意触发逻辑和过渡一致性；移动端应避免依赖:hover。

animation-iteration-count无效最常见原因是animation-name与@keyframes名称不一致或选择器未匹配元素；其次为动画未真正触发，如display:none、visibility:hidden、关键帧无变化或父容器裁剪导致首帧不可见。