如何在CSS中定义绑定到选择器的关键帧的名称？

这些天来，动画网站有所增加。在网页上编写和运行动画需要使用关键帧来为正在执行动画的帧设置某种规则。在关键帧中写入所需的属性时，我们基本上分配了一个从 0% 到 100% 变化的值。 0% 表示动画开始，100% 表示结束。关键字from和to which 指定从哪个级别到哪个级别我们必须 100% 运行动画。

绑定到选择器的关键帧的名称是使用animation-name属性定义的。动画属性还可用于将名称定义为其第一个属性。

句法：

element-selector {
  animation-name: name;
}

以下示例演示了如何指定绑定到选择器的关键帧的名称。

示例 1：使用 animation-name 属性。

HTML

  


  

    GeeksforGeeks
  
  

    This is animation effect
    using @keyframes
  
  

输出：

示例 2：使用动画属性。

HTML

  


  

    GeeksforGeeks
  
  

    This is animation effect
    using @keyframes
  
  

输出：