时间戳

首页 > 解决方案 > 如何使用 animate.css

html - 如何使用 animate.css

问题描述

我正在尝试使用 animate.css 函数fadeInUp 为 div 设置动画，但它不起作用。

    <html>
    <head>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css" />
    </head>
    <body>
    <div class="grid mt-4 claim animate__animated animate__fadeInUp"></div>
    </body>
    </html>

标签： htmlcssanimationcss-selectors

解决方案

要延迟动画，您需要使用 rule animation-delay。像这样：

div {
  animation-delay: 5s;
}
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css" />

<div class="grid mt-4 claim animate__animated animate__fadeInUp">test</div>

推荐阅读