动画后的 CSS 代码不起作用答案

【问题标题】：CSS code after an animation doesn't work动画后的 CSS 代码不起作用
【发布时间】：2018-09-20 04:37:13
【问题描述】：

我有一个问题，为什么我的 CSS 代码放在动画之后不起作用。

这是一个例子：

img {
    max-width: 50px;
}

@keyframes slidedown {
  from {
    margin-top: 100%;
    height: 300%;

  to {
    margin-top: 0%;
    height: 300%;
  }
}

img {
    max-width: 50px;
}

img 放在动画前会是 50px，放在动画后会填满整个页面。

这只是一个例子（动画是关于文本的）。但我不明白为什么我的 CSS 代码在动画之后编写时不起作用。

【问题讨论】：

告诉我们它不起作用，所以我们可以看到......它可能是别的东西
Problem solved, a bracket lacked at the end of the animation. --> 最好先删除问题，然后再投反对票和关闭投票
投票结束，因为这个问题是由无法再复制的问题或简单的印刷错误引起的。虽然类似的问题可能是这里的主题，但这个问题的解决方式不太可能帮助未来的读者。
在发布到 Stack Overflow 之前，最好通过 JS Fiddle 等编辑器/测试器运行您的代码。一个简单的复制/粘贴即可显示您的错误。
但是我不能删除它，因为有答案，对不起。

标签： css image animation

【解决方案1】：

您在from 声明之后和to 声明之前缺少一个结束}。试试：

@keyframes slidedown {
  from {
    margin-top: 100%;
    height: 300%;
  }
  to {
    margin-top: 0%;
    height: 300%;
  }
}

【讨论】：