animation-delay 值单位可以是秒（s）或毫秒（ms）。
提示: 允许负值，-2s 使动画马上开始，但跳过 2 秒进入动画。
语法
animation-delay: time
time可选。定义动画开始前等待的时间，以秒或毫秒计。默认值为0
1、@keyframes规则。from{属性：值} to{属性：值}。
2、0%{属性：值} 100%{属性：值}0% 是动画的开始，100% 是动画的完成。可以在二者之间加入25%，50%等。
3、将动画绑定到选择器：在样式中，设置动画属性animation，自定义动画名称和时长。
4、规定动画开始时的等待时间：animation-delay：时间；可以为秒、毫秒2s，2ms。
5、播放次数：animation-iteration-count：次数；永久播放的值取infinite。
6、动画速度曲线：animation-timing-function：变化类型；变化类型有：linear 匀速；ease-in 开始慢；ease-out 结束慢；ease 动画有一个缓慢的开始，然后快，结束慢。
扩展资料
animation 属性是一个简写属性，用于设置六个动画属性：
1、animation-name
规定需要绑定到选择器的 keyframe 名称。
2、animation-duration
规定完成动画所花费的时间，以秒或毫秒计。
3、animation-timing-function
规定动画的速度曲线。
4、animation-delay
规定在动画开始之前的延迟。
5、animation-iteration-count
规定动画应该播放的次数。
6、animation-direction
规定是否应该轮流反向播放动画。
注释：请始终规定 animation-duration 属性，否则时长为 0，就不会播放动画了。
可以
Transition允许CSS的属性值在一定的时间区间内平滑地过渡。这种效果可以在鼠标单击、获得焦点、被点击或对元素任何改变中触发，并圆滑地以动画效果改变CSS的属性值，它的语法如下：
transition: property duration timing-function delay/*
property：执行过渡的属性
duration：执行过渡的持续时间
timing-function：执行过渡的速率模式
delay：延时多久执行
*/
transition-property
可取值：
none
没有属性会获得过渡效果。
all
所有属性都将获得过渡效果。
property
定义应用过渡效果的 CSS 属性名称列表，列表以逗号分隔。
div{transition-property:width-moz-transition-property: width/* Firefox 4 */-webkit-transition-property:width/* Safari 和 Chrome */-o-transition-property:width/* Opera */}
transition-duration
参数为时间，单位为s（秒）或者ms（毫秒），默认就是0，回想一下如果只有transform属性，是不是变换啪地一下完成了。
div{transition-duration: 5s-moz-transition-duration: 5s/* Firefox 4 */-webkit-transition-duration: 5s/* Safari 和 Chrome */-o-transition-duration: 5s/* Opera */}transition-timing-function
既然是动画，那么就有动画的运行速率，不同的速度会产生不同的结果，以下是可取值。
ease：（逐渐变慢）默认值，ease函数等同于贝塞尔曲线(0.25, 0.1, 0.25, 1.0).
linear：（匀速），linear 函数等同于贝塞尔曲线(0.0, 0.0, 1.0, 1.0).
ease-in：(加速)，ease-in 函数等同于贝塞尔曲线(0.42, 0, 1.0, 1.0).
ease-out：（减速），ease-out 函数等同于贝塞尔曲线(0, 0, 0.58, 1.0).
ease-in-out：（加速然后减速），ease-in-out 函数等同于贝塞尔曲线(0.42, 0, 0.58, 1.0)
速率示意图
transition-delay
参数为时间，单位为s（秒）或者ms（毫秒），默认就是0，也就是立即执行，如果在多个动画直接有先后顺序，那么它就会派上用场。
把它们写在一起
浏览器内核的前缀不能忘啊，使用emmet神器来帮助你。
emmet使用如图所示：
-webkit-transition: all 0.5s ease-in-out 0s-o-transition: all 0.5s ease-in-out 0s
transition: all 0.5s ease-in-out 0s
如图所示
将它们放在一起的效果如下，可以很明显的发现它们之间的不同。
