Html 忽略/未考虑CSS关键帧

我在CSS中将此动画用作mixin（在LESS中）。 动画之所以有效，是因为它显然考虑了第一部分，但没有考虑@keyframes的内容。如果删除@keyframes，则不会对动画进行任何更改。 但问题是我需要应用@keyframes参数，因为在chromium中，它是模糊的，并且有一个修复（-webkit filter（0）），但它似乎不起作用，因为没有考虑关键帧

.VANISHIN {


 -webkit-animation-name: vanishIn;
  animation-name: vanishIn;

    animation-duration: 0.5s;   
    -webkit-animation-duration: 0.5s;

    animation-iteration-count: 1;
    -webkit-animation-iteration-count: 1;
}

@-webkit-keyframes vanishIn {
  0% {
    opacity: 1;
    -webkit-transform-origin: 50% 50%;
    -webkit-transform: scale(2, 2);
  }

  100% {
    opacity: 1;
    -webkit-transform-origin: 50% 50%;
    -webkit-transform: scale(1, 1);
  }
}
@keyframes vanishIn {
  0% {
    opacity: 1;
    transform-origin: 50% 50%;
    transform: scale(2, 2);
    -webkit-filter: blur(0px);
  }

  100% {
    opacity: 1;
    transform-origin: 50% 50%;
    transform: scale(1, 1);
    -webkit-filter: blur(0px);
  }
}

---

你能更清楚地解释一下你的意思吗？如果我移除@keyframes，它不会改变动画的任何内容？不太清楚，抱歉耽误了你的时间。这意味着，如果我完全从css中删除该部分，它仍然以相同的方式工作。这意味着它什么也不做。如果我修改@keyframes中的设置，它不会改变任何内容。.Vanish in{-webkit动画名称：Vanish in；动画名称：Vanish in；动画持续时间：0.5s；-webkit动画持续时间：0.5s；动画迭代次数：1；-webkit动画迭代次数：1；}使用或不使用关键帧的效果相同关键帧对于动画来说是必需的，因此只有两种可能性—（a）关键帧是在代码中的其他地方定义的（例如库或外部CSS文件等），或者（b）动画根本不起作用。创建一个演示，它将更容易调试。