animation-name

animation-name属性指定应用的一系列动画，每个名称代表一个由@keyframes定义的动画序列。

/* Single animation */
animation-name: none;
animation-name: test_05;
animation-name: -specific;
animation-name: sliding-vertically;

/* Multiple animations */
animation-name: test1, animation4;
animation-name: none, -moz-specific, sliding;

/* Global values */
animation-name: initial
animation-name: inherit
animation-name: unset

使用简写属性animation可以很方便地同时设置所有的动画属性。

初始值	`none`
适用元素	all elements, `::before` and `::after` pseudo-elements
是否是继承属性	否
计算值	as specified
Animation type	discrete

语法

值

none: 特殊关键字，表示无关键帧。可以不改变其他标识符的顺序而使动画失效，或者使层叠的动画样式失效。
IDENT: 标识动画的字符串，由大小写敏感的字母a-z、数字0-9、下划线(_)和/或横线(-)组成。第一个非横线字符必须是字母，数字不能在字母前面，不允许两个横线出现在开始位置。
Formal syntax [ none | <keyframes-name> ]# where <keyframes-name> = <custom-ident> | <string>

标准

Specification	Status	Comment
CSS Animations Level 1 animation-name	Working Draft

We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help! (en-US)

Desktop
Mobile

Feature	Chrome	Firefox (Gecko)	Internet Explorer	Opera	Safari (WebKit)
Basic support	(Yes)-webkit (en-US)	5.0 (5.0)-moz (en-US) 16.0 (16.0)	10	12 -o (en-US) 12.10 #	4.0-webkit (en-US)

Feature	Android	Firefox Mobile (Gecko)	IE Phone	Opera Mobile	Safari Mobile
Basic support	(Yes)-webkit (en-US)	5.0 (5.0)-moz (en-US) 16.0 (16.0)	10	?	?

animation-name

语法

值

Formal syntax

示例

标准

浏览器兼容

See also