Animate.css：一个包含 80 多个令人惊艳的 CSS 动画的库 (animation翻译)

文章编号：1674 / 更新时间：2024-12-30 15:36:29 / 浏览：次
animation翻译

Animate.CSS 是一个轻量级 CSS 库，其中包含超过 80 个预先制作的 CSS 动画。这些动画非常适合为您的网站或网络应用程序添加一些视觉趣味和动感。

如何使用 Animate.css

使用 Animate.css 非常简单。只需将以下代码添加到您的 html 文档的部分：

您可以将 CSS 类添加到您希望应用动画的 HTML 元素。例如，要将淡入动画应用于元素，您可以使用以下类：


  左右滚动
 
 
  上下震颤
 
 
  左右震颤
 
 
  弹跳
 
 
  弹跳进入
 
 
  弹跳退出
 
 
  弹入
 
 
  弹出
 
 
  滑动进入
 
 
  滑动退出
 
 
  交叉淡入
 
 
  交叉淡出
 
 
  闪现
 
 
  橡胶带
 
 
  摆动
 
 
  轻推
 
 
  轻推进入
 
 
  轻推退出
 
 
  俯冲
 
 
  俯冲进入
 
 
  俯冲退出
 
 
  从上到下
 
 
  从右到左
 
 
  从下到上
 
 
  从左到右
 
 
  延迟
 
 
  无限
 
 
  反弹
 
 
  弹性
 
 
  滑入右
 
 
  滑入左
 
 
  滑入上
 
 
  滑入下
 
 
  滑出右
 
 
  滑出左
 
 
  滑出上
 
 
  滑出下
 
 
  轻弹
 
 
  轻弹进入
 
 
  轻弹退出
 
 
  后退
 
 
  后退进入
 
 
  后退退出
 
 
  旋转 3D
 
 
  旋转 3D 上
 
 
  旋转 3D 下
 
 
  旋转 3D 左
 
 
  旋转 3D 右
 
 
  透视
 
 
  视角向下
 
 
  视角向上
 
 
  视角左侧
 
 
  视角右侧
 
 
  自定义 Animate.css 动画
 
 
  您还可以自定义 Animate.css 动画。有关更多信息，请参阅 Animate.css 文档。
 
 
  结论
 
 
  Animate.css 是一个非常棒的 CSS 库，可以为您的网站或网络应用程序添加一些视觉趣味和动感。它易于使用，并且包含超过 80 个预先制作的动画，可以在许多不同的情况下使用。