CSSKeyframesRule:name 属性

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since August 2016.

CSSKeyframeRule 接口的 name 属性用于获取和设置动画的名称,该名称被 animation-name 属性使用。

字符串。

示例

以下 CSS 包含一个关键帧 at 规则。这将是 document.styleSheets[0].cssRules 返回的第一个 CSSRulemyRules[0] 返回一个 CSSKeyframesRule 对象,其 name 属性设置为 "slide-in"

css
@keyframes slide-in {
  from {
    transform: translateX(0%);
  }

  to {
    transform: translateX(100%);
  }
}
js
let myRules = document.styleSheets[0].cssRules;
let keyframes = myRules[0]; // CSSKeyframesRule
console.log(keyframes.name); // "slide-in"

规范

Specification
CSS Animations Level 1
# dom-csskeyframesrule-name

浏览器兼容性