保留CSS动画颜色填充

Question

我正在尝试创建一个在滚动时改变颜色的变形标志。我简化了我的 css 以使其更易于解释。

@-webkit-keyframes rotate-change {
        100% {fill:blue}
}

.change{
  fill:red;
  -webkit-animation: rotate-change;
}

class 为“.change”的项目以红色填充色开头。我想要的是在动画结束后将填充颜色更改为蓝色，就像“-webkit-keyframes”一样。唯一的问题是，在动画期间，填充颜色从红色变为蓝色，但当动画结束时，填充颜色恢复为红色。有没有办法永久保留动画的填充颜色，即使在结束后也是如此？

Answer 1

尝试

animation-fill-mode:forwards;

Retain CSS Animation Color Fill