过去，使用网络来实现交互式动画的效果。近年来，随着时代的消除，功能的增强，现代网络应用程序的相互作用变得越来越丰富。在实施CSS交互式动画的基础上，关键知识点是，文章中涉及的代码示例效果可以单击以查看动画效果。
动画的实现原理类似于CSS块之间的关键帧的实现。以下定义了一个动画，以逐渐将元素的级别从平稳地更改为：
每个语句都需要一个名称，这通常是交互式动画效果的名称。上面的代码设置了一个滑动效果名称。
像其他CSS一样，动画可以是通用和可重复使用的，并且可以应用于特定选择器的属性：
上面的代码在内部设置，属性已更改并立即执行。
您可以在同一动画语句中定义多个属性的更改，如下所示：
动画效果使用属性，在每个动画周期中定义CSS动画的节奏，这通常被认为是动画效果，相似。
默认情况下，动画只能运行一次，但是您可以使用属性来控制动画执行时间的数量。
如果将其设置为无限时间的值，则有限数量中的次数符合特定要求。
除关键字外，您还可以使用百分比，可以定义两个或多个动画步骤：
假设应“呼吸”，充气和偏转。您可以将其设置为3步动画：
上面的动画效果还具有一种更优雅的方法来使用属性来指示动画是否反向。
上面定义的动画基于定义不同值的不同属性。像其他CSS属性一样，它只只能定义一个属性值，即。
定义动画属性的方法如下：
一种更简洁的方法也是推荐的使用方法，这与不同的顺序没有什么不同：
动画的令人困惑的方面可能是填充模式，这是通往信仰之路的最大障碍。闪烁：
为什么元素在执行动画后再次闪烁并完全可见。这是因为只有在动画运行时，块中的语句才有效。
动画完成后，根据CSS语句显示元素，默认情况下透明度不透明。因此，在动画完成后，透明度将返回到不透明。
解决此问题的一种方法是在动画外声明透明度，如下：
尽管以上方案解决了问题，但这不是最好的方法。最好的方法是使用属性，如何在设置CSS动画之前和之后将样式应用于其目标。
属性的参数具有以下四个：
： 这是默认值。当动画未执行时，动画将不会对目标应用任何样式，但是将已授予元素的CSS规则应用于显示元素；：该目标将保留在执行期间遇到的最后一个最后一个。关键帧的计算值，最后一个关键帧取决于总和的值;：动画将在应用目标时立即应用第一个关键帧中定义的值，并在此期间保留此值。第一个密钥帧依赖关于值；：动画将遵循规则，以两个方向扩展动画属性。
动画会实现基本动画效果，并在与CSS变量一起使用时可以定义更复杂的效果。
CSS动画可以是通用和可重复使用的，但是该动画始终允许元素弹跳62px。如果不同的元素可以提供不同的“弹跳高度”，则可以提高动画的灵活性。
使用CSS变量来做到这一点：
近年来，CSS发生了多少变化，功能变得越来越强，未来的Web应用程序变得更好，更丰富。