700字范文,内容丰富有趣,生活中的好帮手!
700字范文 > html中定义动画名字和规则 CSS3-animation属性和@keyframes规则

html中定义动画名字和规则 CSS3-animation属性和@keyframes规则

时间:2021-10-22 08:36:19

相关推荐

html中定义动画名字和规则 CSS3-animation属性和@keyframes规则

animation 取值情况:

(1)name : 动画名字

(2)duration: 动画持续的时间

(3)animation-timing-function:定义动画以什么速度曲线完成动画

①linear: 动画从开始到结束的速度都是一样的;

②ease : 默认值,以低速开始,然后加快,结束前变慢;

③ease-in : 动画以低速开始;

④ease-out : 动画以低速结束;

⑤ease-in-out:动画以低速开始和结束;

⑥cubic-bezier(n,n,n,n):n是0到1之间的数,定义自己的速度曲线;

(4)animation-delay:动画延迟时间,默认为0,可以取负值,单位是秒或毫秒;

(5)animation-iteration-count:定义动画的播放次数,或无限次播放(infinite);

(6)animation-direction: 规定动画播放方式

①normal: 默认值,正常播放;

②reverse:动画反向播放;

③alternate:在奇数时正常播放,偶数时反向播放;

④alternate-reverse:在奇数时反向播放,偶数时正向播放;

(7)animation-fill-mode:

(8)animation-play-s

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。