不用导入animate库,也能实现animate的动画

1、基础公共代码

css 复制代码
.animated {
  animation-duration: .8s; // 持续时间
  animation-fill-mode: both;
}

2、 在animate官网(Animate.css | A cross-browser library of CSS animations.)找到自己需要的css效果,复制名字,例如:bounce

3、到github上找源码(https://github.com/animate-css/animate.css

4、把源码拷贝下来复制到自己项目代码的css中

注意:如果 不生效,很有可能你没有把公共的基础代码(animated)加进去

参看文献:Animate.css动画库,简单的使用,以及源码剖析_animate动画代码_Unknowncheats的博客-CSDN博客

相关推荐
GISer_Jing1 分钟前
Claude Code项目配置终极指南
前端·ai·ai编程
MPGWJPMTJT4 分钟前
从 Volta 迁移到 mise:Windows 下 Node 版本管理切换记录
前端·node.js
米丘4 分钟前
vue3.x 调度器(Scheduler)实现机制
前端·javascript·vue.js
米饭同学i4 分钟前
Vue2 + Webpack 老项目启动报错
前端
小彭努力中15 分钟前
205.Vue3 + OpenLayers:加载动画,采用 CSS 的 @keyframes 方式
前端·css·vue.js·openlayers·cesium·webgis
木斯佳18 分钟前
前端八股文面经大全:上海威派格前端实习(2026-05-07)·面经深度解析
前端
_Twink1e19 分钟前
基于Vue的纯前端的库存销售系统
前端·vue.js·vue·web
幽络源小助理27 分钟前
音频在线剪切助手网页版源码 – 纯前端HTML单文件免费分享
前端·音视频
陈振wx:zchen200827 分钟前
前端-面试题-Vue
前端·vue.js
计算机安禾28 分钟前
【c++面向对象编程】第5篇:类与对象(四):赋值运算符重载
java·前端·c++