CSS3的动画应用越来越多了,Animate.css一个从名字上就知道干什么的动画框架。

github上的访问地址:http://daneden.github.io/animate.css/

使用方法

引用css

 <link rel="stylesheet" href="animate.min.css" />

然后在需要动画效果的元素上添加animated和网页上显示的API的名字即可,比如:

<div class="animated bounce"></div>

简单吧!赶快试试吧!

CSS3动画框架 Animate.css的更多相关文章

  1. css3动画和animate.css动画库使用

    CSS3动画 css3动画可以分为两种.transition过渡动画和keyframes关键帧动画 过渡动画 第一种叫过渡(transition)动画,就是从初始状态过渡到结束状态这个过程中所产生的动 ...

  2. vue 动画框架Animate.css @keyframes

    <script src="vue.js"></script> <link rel="stylesheet" href=" ...

  3. CSS动画框架Loaders.css +animate.css

    CSS加载动画框架Loaders.css 是一款非常出色的加载动画框架,Loaders.css利用纯CSS可以实现很多种样式的Loading加载动画,这些动画并不需要图片来辅助,而是仅仅需要CSS即可 ...

  4. 强大的CSS3动画库animate.css

    今天要给大家介绍一款强大的CSS3动画库animate.css,animate.css定义了大概50多种动画形式,包括淡入淡出,文字飞入.左右摇摆动画等等.使用animate.css也非常简单,你可以 ...

  5. 使用CSS3动画库animate.css

    IE9及更早版本的IE浏览器都不支持css3动画 谷歌浏览器.火狐浏览器.IE10+浏览器以及移动端浏览器等这些都支持css3动画 animate.css内置了很多典型的css3动画   用法   1 ...

  6. css3动画之animate

    CSS3 动画属性 下面的表格列出了 @keyframes 规则和所有动画属性: 语法:div{animation: 动画名称 一个周期播放时间 速度曲线 延迟时间 下个周期是否逆向} @keyfra ...

  7. CSS3动画库——animate.css

    初见animate.css的时候,感觉很棒,基本上很多常用的CSS3动画效果都帮我们写好了,所以想要哪一种效果直接就可以拿过来用,甚是方便: 效果展示官网:http://daneden.github. ...

  8. 动画利器animate.css

    使用过CSS3编写动画的同学一定感叹CSS3的强大,但是也会感到书写的麻烦.每次都要计算动画的各个参数,十分麻烦.有没有一个库能封装一些常用的CSS3动画效果.答案是肯定的,animate.css就是 ...

  9. 微信网页动画---swiper.animate.css

    项目需要,自己写了个demo <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> ...

随机推荐

  1. P3293 [SCOI2016]美味 主席树+按位贪心

    给定长度为 \(n\) 序列 \(a[i]\) ,每次询问区间 \([l,r]\) ,并给定 \(b,x\) 中的一个数 \(p=a[i]\) ,使得最大化 \(b \bigoplus p^x\) 主 ...

  2. java.util.Properties 读取配置文件中的参数

    用法 getProperty方法的返回值是String类型. java.util.Properties 读取配置文件中的参数 //读取配置文件 FileInputStream inStream = n ...

  3. CSS3 过渡 (transition )

    transition 属性是一个简写属性,用于设置四个过渡属性: 1.transition-property   设置过渡效果的 CSS 属性的名称.一般写all 2.transition-durat ...

  4. noi.ac #30 思维

    \(des\) 给定升序数组 \(A, B\) 对于任意两个集合 \(a, b\) 分别是 \(A, B\) 的子集,总价值为较小的集合的和, 总代价为 \((|a| + |b|) \times w\ ...

  5. 自行撰写Grasshopper电池

    Grasshopper目前作为参数化设计是非常常用的工具,但是人们会经常碰到它提供的电池不能满足自己设计方案需求的情况,所以就需要自己创作电池,而最简单的一种方法就是自己写. 工具: Visual S ...

  6. SpringCloud:Zipkin链路追踪,并将数据写入mysql

    1.zipkin server 1.1.新建Springboot项目,zinkin 1.2.添加依赖 <dependency> <groupId>io.zipkin.java& ...

  7. Java8中LocalDate的使用---项目中日期处理

    // 获取当前日期 LocalDate now = LocalDate.now(); // 设置日期 LocalDate now2 = LocalDate.of(2099, 2, 28); // 解析 ...

  8. oracle清理归档日志(缓存)

    1.用RMAN连接目标DB: rman target / RMAN target sys/*****@orcl 2.在RMAN命令窗口中,输入如下命令(清理所有的归档日志): crosscheck a ...

  9. JVM 初始化阶段例子

    创建如下Demo package com.example.jvm.classloader; class Parent{ static int a = 3; static { System.out.pr ...

  10. F12找到页面某一元素所绑定的点击事件

    比如我要查看银行账号这个标签所绑定的事件. 操作过程中使用的是谷歌浏览器 第一步:在该元素上右键→检查 第二步:点击Event Listeners 这样就能看到该元素绑定的所有事件了 第三步:展开cl ...