CSSKeyframesRule - 描述了一个代表 CSS 动画完整关键帧集合的对象
这是一个实验中的功能
此功能某些浏览器尚在开发中，请参考浏览器兼容性表格以得到在不同浏览器中适合使用的前缀。由于该功能对应的标准文档可能被重新修订，所以在未来版本的浏览器中该功能的语法和行为可能随之改变。
CSSKeyframesRule 接口描述了一个代表 CSS 动画完整关键帧集合的对象。它对应于包含整个 @keyframes at-rule。它实现了 CSSRule 接口，其类型值为 7（KEYFRAMES_RULE）。
属性
作为 CSSRule 的子类，CSSKeyframesRule 也实现了这些接口的属性。它有两个特有的属性：
CSSKeyframesRule.name
表示动画的名称，由 animation-name 属性使用。
CSSKeyframesRule.cssRules 只读
返回媒体规则中 CSS 规则的 CSSRuleList。
方法
作为 CSSRule 的子类，CSSKeyframesRule 也实现了该接口的方法。它有三个特有的方法：
CSSKeyframesRule.appendRule()
在当前的 CSSKeyframesRule 中插入新的关键帧规则。参数是一个 DOMString，其中包含一个格式与@keyframes at-rule 条目格式相同的关键帧。如果它包含多个关键帧规则，则会抛出带有 SYNTAX_ERR 的 DOMException。
CSSKeyframesRule.deleteRule()
从当前的 CSSKeyframesRule 中删除关键帧规则。它的参数是要删除的关键帧的索引，是一个 DOMString，值为 0 和 1 之间的数字。
CSSKeyframesRule.findRule()
返回与给定键相对应的关键帧规则。它的参数是要删除的关键帧的索引，是一个 DOMString，值为 0 和 1 之间的数字。如果不存在相应的关键帧， findRule 返回 null。
规范
| 规范 | 状态 | 备注 |
|---|---|---|
| CSS Animations CSSKeyframesRule 的定义 |
工作草案 | 初始定义 |
桌面浏览器兼容性
| 特性 | Chrome | Edge | Firefox | Internet Explorer | Opera | Safari |
|---|---|---|---|---|---|---|
| 基础支持 | 支持 | 支持 | 5.0 -moz 48 |
10 | 12 -o 12.10 |
4.0 |
appendRule |
支持[1] | 未知 | 5.0[2] 22.0 |
10[3] | 支持[3] | 支持[3] |
移动浏览器兼容性
| 特性 | Android | Android Webview | Edge | Firefox Mobile | IE Mobile | Opera Mobile | Safari Mobile | Chrome for Android |
|---|---|---|---|---|---|---|---|---|
| 基础支持 | 未知 | 支持 | 支持 | 5.0 -moz 48 |
支持 | 12 -o 12.10 |
支持 | 支持 |
appendRule |
未知 | 支持[1] | 未知 | 5.0[2] 22.0 |
支持[3] | 支持[3] | 支持[3] | 支持[1] |
[1] Chrome 45 中删除了非标准名称 insertRule()。
[2] Gecko 5.0 使用非标准名称 insertRule() 实现了它。在 Gecko 22.0 中，它被改为标准名称 appendRule。
[3] Internet Explorer 10，Safari 和 Opera 使用非标准名称 insertRule() 来实现它。