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

相关推荐
BigTopOne3 分钟前
什么是行权价,什么是权利金,什么是行权?
前端
xlxxy_5 分钟前
sap获取批次特性报表
java·linux·开发语言·前端·数据库·abap·mm
BigTopOne6 分钟前
Long put and Long call
前端
摇滚侠11 分钟前
SpringBoot3+Vue3 全套视频教程 61
vue.js
breeze jiang12 分钟前
告别等待焦虑:Vue 3 + DeepSeek 实现 AI 打字机流式对话,用户体验提升立竿见影
vue.js·人工智能·ux
石像鬼₧魂石15 分钟前
【Y2Ksoft】贵阳陈桥饭店ERP管理系统
大数据·前端·物联网·html·数据库架构
TheITSea21 分钟前
4、React+Tailwind CSS
前端·css·react.js
weedsfly29 分钟前
前端开发中的代理模式——从 Vue 3 响应式到日常开发
前端·javascript·面试
Li.map43 分钟前
CesiumJS 地图主题系统:用着色器打造实时滤镜
javascript·arcgis·cesium·着色器
用户298698530141 小时前
在 React 中通过 JavaScript 实现 Excel 单元格、行与列的锁定保护
javascript·react.js·excel