时间戳

首页 > 解决方案 > 本地加载时 Animate.css 将不起作用

javascript - 本地加载时 Animate.css 将不起作用

问题描述

我有一个烧瓶服务器，它托管一个用于测试的 html 文件。在这个 html 的开头，我想链接到本地​​存储的 animate.min.css 文件 ( <link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='animate.min.css') }}"> )。当我打开页面时，我可以查看检查器并查看链接的 css 文件（我可以打开它），但样式不起作用（例如<h1 class="animated zoomIn">Index Page</h1>，不会做动画）。但是，当我使用来自 CDN ( <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.min.css">) 的文件时，它可以工作并且效果是可见的。
这是为什么？难道我做错了什么？这是我第一次使用它，所以我没有太多经验。请询问是否缺少某些信息。

整个代码：

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8"/>

    <link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='animate.min.css') }}">
    <!--<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.min.css">-->
    
    <script src="{{ url_for('static', filename='jquery-3.5.1.min.js') }}"></script>
    </head>

    <body>
        <h1 class="animated zoomIn">Index Page</h1>
    </body>
</html>

目录结构：

笔记：


提前致谢。

标签： javascripthtmljquerycssanimate.css

解决方案

检查您是否需要更早或更当前的版本。不时有这个问题，只有一个组件得到更新，现在不能再与另一个组件一起使用。

推荐阅读