好用的样式动画库集合(css、js)

文章目录

  • 前言
  • 一、Animate.css
  • 二、Anime.js
  • 三、CSShake
  • 四、Hover.css
  • 五、AniJS
  • 六、Animista
  • 七、Tachyons-animate
  • 八、Sequence.js
  • 九、Infinite
  • 十、OBNOXIOUS.CSS
  • 十一、MOTION UI
  • 十二、Keyframes.app
  • 十三、AnimXYZ
  • 十四、Whirl
  • 十五、Hamburgers
  • 十六、Vivify
  • 十七、Magic Animations CSS3
  • 十八、cssanimation.io
  • 十九、Angrytools
  • 二十、WickedCSS
  • 二十一、Three Dots
  • 二十二、背景图-bansal
    • `如有启发,可点赞收藏哟~`


前言

好用的css动画


一、Animate.css

Animate.css

在这里插入图片描述

二、Anime.js

Anime.js

是一个轻量级的 JavaScript 动画库,具有简单但功能强大的 API。它适用于 CSS 属性、SVG、DOM 属性和 JavaScript 对象
在这里插入图片描述

三、CSShake

CSShake
一个专门为在你的网页中摇动元素而设计的 CSS 库
在这里插入图片描述

四、Hover.css

Hover.css
一个 CSS 动画库,旨在与你的网站中的按钮和其他 UI 元素一起使用
在这里插入图片描述

五、AniJS

AniJS
AniJS 是一个动画库,允许您以简单的“类似句子”的结构向元素添加动画
在这里插入图片描述

六、Animista

Animista
按需 CSS 动画
在这里插入图片描述

七、Tachyons-animate

Tachyons-animate
Tachyons 本身是一个具有大量实用程序类的原子 CSS 库,用于通过向你需要的内容添加类来设计任何东西
在这里插入图片描述

八、Sequence.js

Sequence.js
Sequence.js 是一个 JavaScript 库,它提供了一个响应式 CSS 框架,用于创建独特的滑块、演示文稿、横幅和其他基于步骤的应用程序
在这里插入图片描述

九、Infinite

Infinite
这些动画,如旋转和脉冲,专门设计用于永远运行和重复
在这里插入图片描述

十、OBNOXIOUS.CSS

OBNOXIOUS.CSS
在这里插入图片描述

十一、MOTION UI

MOTION UI
用于创建灵活的 CSS 过渡和动画的 Sass 库
在这里插入图片描述

十二、Keyframes.app

Keyframes.app
用于生成自定义 CSS 关键帧动画的图形用户界面

在这里插入图片描述

十三、AnimXYZ

AnimXYZ
AnimXYZ 可帮助你为你的网站创建、自定义和组合动画。专为 Vue、React、SCSS 和 CSS 构建
在这里插入图片描述

十四、Whirl

Whirl
轻松加载 CSS 动画!

十五、Hamburgers

Hamburgers

Hamburgers 是一组CSS 动画汉堡包图标。还包括作为 Sass 库的源。它是模块化和可定制的,所以你可以自己做汉堡包。
在这里插入图片描述

十六、Vivify

Vivify
在这里插入图片描述

十七、Magic Animations CSS3

Magic Animations CSS3
在这里插入图片描述

十八、cssanimation.io

cssanimation.io
在这里插入图片描述

十九、Angrytools

Angrytools
在这里插入图片描述

二十、WickedCSS

WickedCSS
在这里插入图片描述

二十一、Three Dots

Three Dots
在这里插入图片描述

二十二、背景图-bansal

bansal
在这里插入图片描述


如有启发,可点赞收藏哟~

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/224641.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

C++标准模板库 STL 简介(standard template library)

在 C 语言中,很多东西都是由我们自己去实现的,例如自定义数组,线程文件操作,排序算法等等,有些复杂的东西实现不好很容易留下不易发现的 bug。而 C为使用者提供了一套标准模板库 STL,其中封装了很多实用的容器&#xf…

网络工程师精华篇,50种网络故障及解决方法大集合

上午好,我的网工朋友。 做网络工程师,自然离不开网络,而日常工作中能搞多少大项目?最常见的其实还是网络故障的处理了。 怎么最高效地排查网络故障?怎么简单几招通网? 今天就从基础的入手,分…

QT QComBox实现模糊查询

一、概述 在Qt中,可以通过QComboBox和QLineEdit实现模糊查询的功能。模糊查询是指根据用户输入的文本,在下拉框的选项中进行模糊匹配,并动态地显示匹配的选项。 二、基础知识 1、QCompleter (1)QCompleter 是 Qt 框架中提供的一个用于自动…

巅峰对决 LlamaIndex 与 OpenAI API大比拼

我们进行了一项详尽的分析,比较了 OpenAI 助手 API 和 LlamaIndex 在 RAG 性能方面的差异。目的是使用Tonic Validate评估各种RAG系统,该系统是一个RAG评估和基准平台,同时使用开源工具tvalmetrics。本文中使用的所有代码和数据都可以在这里找…

GaussDB数据库SQL系列-触发器

目录 一、前言 二、触发器概念 三、GaussDB数据库中的触发器 1、语法格式 2、创建步骤 3、注意事项 4、附:表和视图上支持的触发器种类 四、GaussDB数据库中的示例 示例一、在GaussDB数据库中创建一个触发器,以便在插入新记录时自动将记录的创建…

Rocky Linux 9.3 为 PowerPC 64 位带回云和容器镜像

RHEL 克隆版 Rocky Linux 9.3 今天发布了,作为红帽企业 Linux 发行版 CentOS Stream 和 Red Hat Enterprise Linux 的免费替代版本,现在可供下载。 Rocky Linux 9.3 是在 Rocky Linux 9.2 发布 6 个月之后发布的,它带回了 PowerPC 64 位 Lit…

Vatee万腾的数字创新征途:vatee科技力量的独特奇点

在数字化的时代浪潮中,Vatee万腾如一颗耀眼的明星,以其独特的科技奇点引领着数字创新的征途。无论是在人工智能、大数据、云计算,还是智能化领域,Vatee万腾都展现出了与众不同的创新力量,为科技征途描绘了独一无二的奇…

【开源】基于Vue+SpringBoot的学校热点新闻推送系统

项目编号: S 047 ,文末获取源码。 \color{red}{项目编号:S047,文末获取源码。} 项目编号:S047,文末获取源码。 目录 一、摘要1.1 项目介绍1.2 项目录屏 二、功能模块2.1 新闻类型模块2.2 新闻档案模块2.3 新…

[ CSS ] 内容超出容器后 以...省略

内容超出容器后 以…省略 当前效果 代码 <template><div class"box">有志者&#xff0c;事竟成&#xff0c;破釜沉舟&#xff0c;百二秦关终属楚; 有心人&#xff0c;天不负&#xff0c;卧薪尝胆&#xff0c;三千越甲可吞吴</div> </templa…

Linux - 动静态库(下篇)

前言 在上篇博客当中&#xff0c;对静态库是什么&#xff0c;怎么使用&#xff0c;简单实现自己的静态库&#xff0c;这些做了描述&#xff0c;具体请看上篇博客&#xff1a; 本篇博客将会对 动态库是什么&#xff0c;怎么使用&#xff0c;简单实现自己的动态库&#xff0c…

Linux—进程状态、僵尸进程、孤独进程、优先级

&#x1f4d8;北尘_&#xff1a;个人主页 &#x1f30e;个人专栏:《Linux操作系统》《经典算法试题 》《C》 《数据结构与算法》 ☀️走在路上&#xff0c;不忘来时的初心 文章目录 一、进程状态二、僵尸进程、孤儿进程1、Z(zombie)-僵尸进程2、僵尸进程危害3、孤儿进程 三、进…

基于振弦式轴力计和采集仪的安全监测解决方案

基于振弦式轴力计和采集仪的安全监测解决方案 振弦式轴力计是一种测量结构物轴向力的设备&#xff0c;通过测量结构物上的振弦振幅变化&#xff0c;可以确定结构物轴向力的大小。采集仪是一种用于采集和存储传感器数据的设备&#xff0c;通常与振弦式轴力计一起使用&#xff0c…