Internet Explorer 9,以及更早的版本,

不支持 @keyframe 规则或 animation 属性。

Internet Explorer 10、Firefox 以及 Opera 支持 @keyframes 规则和 animation 属性

Chrome和Safari需要前缀-webkit- 

@keyframes(关键帧)

animation 使用规则,Name must,duration must

Animation turn 顺序

animation   所有动画简写,除了animation-play-state

 1、name                   动画名

 2、duration               动画执行(一个周期)时长       默认值:  0

 3、time-function        动画速度曲线                        默认值: ease

 4、delay                    动画何时开始                         默认值: 0

 5、iteration-count      动画被播放的次数                  默认值: 1

 6、direction               动画在下一周期是否逆向播放    默认值: normal

 7、play-state             规定动画是否正在在运行或暂停 默认值:running

 8、fill-mode               规定动画时间之外的状态 

悟性差,记忆差,所以多记记笔记了,必须重新过几遍

概念链接:http://www.w3school.com.cn/css3/css3_animation.asp

CSS3 Animation学习笔记的更多相关文章

  1. css3动画学习笔记

    具体学习地址:http://www.imooc.com/learn/33CSS3中的三种动画:tranform形变动画/transition缓动动画/animation逐帧动画; tranform: ...

  2. 《The Book of CSS3》学习笔记

    一.浏览器前缀 E{ -moz-name : value; /* Firefox */ -ms-name : value; /* IE */ -o-name : value; /* Opera */ ...

  3. css3 animation 学习

    css3中可以实现动画效果,主要是通过css3中新增加的属性(transform , transition,animation )来完成. 他们的详细解释可以参考 W3CSCHOOL 下面是效果图: ...

  4. css3 animation(动画)笔记

    在开始介绍Animation之前我们有必要先来了解一个特殊的东西,那就是"Keyframes",我们把他叫做“关键帧”,玩过flash的朋友可能对这个东西并不会陌生.下面我们就一起 ...

  5. CSS3选择器学习笔记

    CSS选择器总结: 一.基本选择器 1.通配选择器:[  *  ]        选择文档中所以HTML元素. *{margin: 0;padding: 0;} /*选择页面中的所有元素并设置marg ...

  6. Android Animation学习笔记

    原文地址: http://www.cnblogs.com/feisky/archive/2010/01/11/1644482.html 关于动画的实现,Android提供了Animation,在And ...

  7. Android animation学习笔记之view/drawable animation

    前一章中总结了android animation中property animation的知识和用法,这一章总结View animation和Drawable animation的有关知识: View ...

  8. css笔记 - animation学习笔记(二)

    animation动画 @keyframes规则 - 创建动画 from - to 等价于 0% - 100% 但是优先使用0% - 100%,因为浏览器兼容性还好点 animation 动画绑定 将 ...

  9. Animation学习笔记

    关于动画的实现,Android提供了Animation,在Android SDK介绍了2种Animation模式: 1. Tween Animation:通过对场景里的对象不断做图像变换(平移.缩放. ...

随机推荐

  1. tyvj P1864 [Poetize I]守卫者的挑战(DP+概率)

    P1864 [Poetize I]守卫者的挑战 时间: 1000ms / 空间: 131072KiB / Java类名: Main 描述 打开了黑魔法师Vani的大门,队员们在迷宫般的路上漫无目的地搜 ...

  2. Hibernate的Session会话中get()和load()方法的区别

    1.get和load都可以从数据库中获取数据 .get拿到的是真的对象,load拿到的是代理对象 2.get和load从数据库中获取数据,如果获取不到,get返回null,load会出现ObjectN ...

  3. [CF 351B]Jeff and Furik[归并排序求逆序数]

    题意: 两人游戏, J先走. 给出一个1~n的排列, J选择一对相邻数[题意!!~囧], 交换. F接着走, 扔一硬币, 若正面朝上, 随机选择一对降序排列的相邻数, 交换. 若反面朝上, 随机选择一 ...

  4. 将solr3.5整合到Tomcat6.x中

    最近在学习Lucene,然后进入到solr中,没想到一开始,solr就给我来了这么困难的开头,希望万事开头难,以后可以顺利一点吧.记录下将solr3.5整合到Tomcat6.x中的过程,以及遇到的一个 ...

  5. JUnit-4.11使用报java.lang.NoClassDefFoundError: org/hamcrest/SelfDescribing错误

    今天尝试使用JUnit,下载了最新的JUnit版本,是4.11,结果尝试使用发现总是报java.lang.NoClassDefFoundError: org/hamcrest/SelfDescribi ...

  6. C#类型 分类: C# 2015-03-09 08:44 202人阅读 评论(0) 收藏

    C# 类型 引言 本文之初的目的是讲述设计模式中的 Prototype(原型)模式,但是如果想较清楚地弄明白这个模式,需要了解对象克隆(Object Clone),Clone其实也就是对象复制.复制又 ...

  7. ELK初学搭建(elasticsearch)

    ELK初学搭建(elasticsearch) elasticsearch logstash kibana ELK初学搭建 elasticsearch 1.环境准备 centos6.8_64 mini ...

  8. 未能从程序集“WindowsBase, Version=3.0.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35“ 中加载“System.Windows.SplashSceen”

    通过添加windowsbase.dll,可以解决这个问题,你可以在自己的电脑上找到这个文件,地址是:C:\Program Files\Reference Assemblies\Microsoft\Fr ...

  9. HDU2699+Easy

    简单题. /* */ #include<stdio.h> #include<string.h> #include<stdlib.h> #include<alg ...

  10. HTML5游戏开发技术基础整理

    随着HTML5标准终于敲定.HTML5将有望成为游戏开发领域的的热门平台. HTML5游戏能够执行于包含iPhone系列和iPad系列在内的计算机.智能手机以及平板电脑上,是眼下跨平台应用开发的最佳实 ...