51个css动画效果，持续更新中...

使用方式

1. 看名称样式效果图，有没有和自己想要的效果类似的
2. 有的话，复制粘贴代码使用，也可以自己修改一下
3. css效果并不是特别难，只是有时候我们可能想不到
4. 笔者空闲时间，会继续更新的哦，点赞关注不迷路**^_^**

代码github仓库：https://github.com/shuirongshuifu/interestingCSS

1\_鼠标悬浮文字阴影跳动

2\_鼠标悬浮文字底部出现下划线并变宽

3\_文字颜色渐变流光效果

4\_打字机效果

5\_文字左右旋转晃动效果

6\_圆圈呼吸扩散效果

7\_音频波纹加载效果

8\_四周线条环绕流动效果

9\_鼠标悬浮开门关门效果

10\_吃豆人效果

11\_背景颜色流动效果

12\_小球转圈加载效果

13\_钟摆效果

14\_文字烟雾消散效果

15\_水平左右抖动效果

16\_垂直方向坠落弹跳效果

17\_仿figma加载中盒子转圈效果

18\_文字横向伸展模糊淡入淡出效果

19\_四个方向盒子旋转移动进入效果

20\_按钮点击波纹效果

21\_鼠标悬浮按钮边框线条动画效果

22\_灯泡开关效果

23\_鼠标悬浮手风琴样式展开图标效果图

24\_文字按顺序弹跳效果

25\_渐变进度条

26\_文字模糊依次出现

27\_鼠标悬浮探照灯效果

28\_文字光标来回刷效果

29\_输入框校验不通过左右抖动效果

30\_文本逐字展示效果

31\_图片跟随鼠标移动效果

32\_鼠标移动探照灯、点击放大镜效果

33\_emoji仿省略号...动画效果

34\_小飞机跟随鼠标移动

35\_滑块控制动画执行（css精细方式）

36\_边框渐变鼠标悬浮移动效果

37\_骨架屏流光滑动阴影效果（附阴影大全可选）

38\_带角倾斜风格按钮

39\_盒子边界碰撞回弹效果

40\_手机充电动画效果

41\_文字阴影渐变效果

42\_小人眼睛随着鼠标移动效果

43\_笔记本样式效果

44\_两种方式的马赛克背景图

45\_party-js粒子动画

46\_文字抖动阴影

47\_卡片翻页倒计时效果

48\_卡片翻转效果

49\_文字滚动镂空转实体效果

50\_文字从下方依次弹跳出现效果

51\_title-tootip