CSSKeyframesRule: name 属性

Baseline 已广泛支持

此功能已相当成熟，可在多种设备和浏览器版本上运行。自 ⁨2016 年 8 月⁩ 起，所有浏览器均已提供此功能。

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

值

字符串。

CSS 包含一个 @keyframes 规则。这将是 document.styleSheets[0].cssRules 返回的第一个 CSSRule。myRules[0] 返回一个 CSSKeyframesRule 对象，其 name 设置为 "slide-in"。

css

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

  to {
    transform: translateX(100%);
  }
}

let myRules = document.styleSheets[0].cssRules;
let keyframes = myRules[0]; // a CSSKeyframesRule
console.log(keyframes.name); // "slide-in"

规范
CSS 动画级别 1 # dom-csskeyframesrule-name

此页面最后于 ⁨2024年10月8日⁩ 由 MDN 贡献者修改。