首页 > 其他 > 详细

动画属性的简单认识

时间:2017-07-27 00:33:14      阅读:260      评论:0      收藏:0      [点我收藏+]

动画属性这一块掌握不是很熟练,将相关知识点整理到此处,知识点摘自W3school。

 @keyframes        规定动画
animation        所有动画属性的简写属性,除了animation-play-state属性
animation-name         规定@keyframes动画的名称
animation-duration        规定动画完成一个周期所花费的秒或毫秒
animation-timing-function        规定动画的速度曲线
animation-delay        规定动画何时开始
animation-iteration-count        规定动画被播放的次数
animation-direction            规定动画是否在下一周期逆向地播放
animation-play-state            规定动画是否正在运行或暂停
animation-fill-mode            规定对象动画时间之外的状态

通过@keyframes规则,创建动画,以百分比规定改变发生的时间,或者通过关键词“from”和“to”,等价于0%和100%,0%是动画开始的时间,100%是动画的结束时间。

 语法:@keyframes  animationname{
    keyframes-selector{css-styles;}
}

animation属性:
这是一个简写属性,用于设置六个动画属性:
animation-name、animation-duration、animation-timing-function、animation-delay、animation-iteration-count、animation-direction

 

动画属性的简单认识

原文:http://www.cnblogs.com/zhangjiabin/p/7242561.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!