不用导入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博客

相关推荐
Bigger11 分钟前
mini-cc 终端 UI:用 React 写 CLI 是什么体验
前端·react.js·ai编程
在水一缸17 分钟前
警惕供应链陷阱:从 Red Hat npm 恶意包事件看依赖安全防护
前端·安全·npm·供应链安全·red hat·恶意包·依赖安全
cq林志炫20 分钟前
fastadmin 如何限制访问public\assets\libs目录下面的所有html文件
html·php·fastadmin
川冰ICE23 分钟前
JavaScript进阶③|Map_Set_WeakMap_WeakSet,新型数据结构
开发语言·javascript·数据结构
天下无贼!23 分钟前
【功能实现】前端动态表单的实现原理与三种场景实战
前端
小雨下雨的雨25 分钟前
鸿蒙PC用Electron框架 实现 房产交易系统核心算法深度解析
前端·javascript·算法·华为·electron·鸿蒙系统
snow@li26 分钟前
前端:本地电脑和服务器,本质上都是一台计算机。
运维·服务器·前端
吹个口哨写代码31 分钟前
IIS 部署 Vue/React 单页应用 (SPA) 刷新页面 404/403.18 报错原因及终极解决方案
前端·vue.js·react.js
向日的葵00632 分钟前
前端生成实战手册:从提示词到高完成度页面
前端·页面设计
粉末的沉淀32 分钟前
前端:谷歌浏览器拒绝自动播放语音
前端