实用CSS库（持续更新~）

小提示:点击标题直链官网查看文档/在线预览~

1、animate

animate.css 动画库，预设了抖动（shake）、闪烁（flash）、弹跳（bounce）、翻转（flip）、旋转（rotateIn/rotateOut）、淡入淡出（fadeIn/fadeOut）等多达 60 多种动画效果，几乎包含了所有常见的动画效果,可在线预览效果~，

1、通过npm或者yarn下载引入

  npm install animate.css --save 或 yarn add animate.css
  
  import "animate.css"
``` js
##### 2、通过cdn引入

基本用法

<h1 class="animate__animated animate__bounce">Hi animate</h1>

Javascript用法
const element = document.querySelector('.element');
element.classList.add('animate__animated','animate__bounceOutLeft');

2、You-need-to-know-css

一共包含43个CSS的小样式，可在线预览还在持续更新中~，包含各种css效果实现尤其是动画效果，还可以本地克隆安装css预览,可在线预览效果~

• clone 这个仓库: https://github.com/l-hammer/You-need-to-know-css.git
• 用yarn 或者 npm全局安装 docsify-cli: npm install docsify-cli -g (or yarn global add docsify-cli)
• 在终端运行命令 docsify serve
• 打开 http://localhost:3000 在你的浏览器
  

3、CSS-Inspiration

如果没有灵感去可以寻找到使用或者是学习 CSS 的灵感，以分类的形式，展示不同 CSS 属性或者不同的课题使用 CSS 来解决的各种方法,里面包含、布局（Layout）、阴影(box-shadow、drop-shadow)、伪类/伪元素、滤镜(fliter)、边框、背景/渐变(linear-gradient/radial-gradient/conic-gradient)等等小样式，可在线预览效果~

4、CSS Tricks

这里总结一些常用的 CSS 样式记录一些 CSS 的新属性和一点奇技淫巧在“动”部分下有些动画并不是 CSS 效果，因为没有地方放置，所以暂时寄存在这里，可在线预览效果~

5、animista.net

这里有各种样css实现效果，还有代码演示，可在线自行调节动画参数，可直接复制代码，还可以复制压缩后的代码，可在线预览效果~