这是一个实验中的功能
此功能某些浏览器尚在开发中,请参考浏览器兼容性表格以得到在不同浏览器中适合使用的前缀。由于该功能对应的标准文档可能被重新修订,所以在未来版本的浏览器中该功能的语法和行为可能随之改变。

CSS Animations 是CSS的一个模块,它定义了如何用关键帧来随时间推移对CSS属性的值进行动画处理。关键帧动画的行为可以通过指定它们的持续时间,它们的重复次数以及它们如何重复来控制。

参考

CSS 属性

CSS At-规则

指南

检测CSS动画支持
描述用于检测浏览器是否支持CSS动画的技术。
使用CSS动画
关于如何使用CSS创建动画的分步教程,本文介绍每个相关的CSS属性和规则,并解释它们如何交互。
CSS 动画提示
提示和技巧,以帮助您在您的内容中充分利用CSS动画。目前提供了一种用于重播已经运行到完成的动画的技术,这是API本身不支持的。

说明

Specification Status Comment
CSS Animations Working Draft Initial definition.

浏览器兼容性

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!

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Basic support (Yes)-webkit
43.0
5.0 (5.0)-moz
16.0 (16.0)
10 12-o
12.10[2]
4.0-webkit
Feature Android Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile
Basic support 2.1 -webkit [1]
4.0 -webkit
5.0 (5.0)-moz
16.0 (16.0)
? ? (Yes)-webkit

[1] Partial support: animation-fill-mode property is not supported in Android browser below 2.3.

[2] See the release notes to Opera 12.50.

参见

  • Related to CSS Animations, CSS Transitions can trigger animations on user actions.

 

文档标签和贡献者

此页面的贡献者: xgqfrms-GitHub, esterTion, luhai.cui@gmail.com, teoli
最后编辑者: xgqfrms-GitHub,