CSSKeyframeRule

实例属性

继承其祖先 CSSRule 属性。

CSSKeyframeRule.keyText

表示关键帧的键，例如 '10%'、'75%'。from 关键字映射到 '0%'，to 关键字映射到 '100%'。

CSSKeyframeRule.style 只读

返回与关键帧关联的 CSS 样式的 CSSStyleDeclaration。

实例方法

没有特定方法，继承其祖先 CSSRule 方法。

示例

以下 CSS 包括一个关键帧规则。这将是 document.styleSheets[0].cssRules 返回的第一个 CSSRule。 myRules[0] 返回一个 CSSKeyframesRule 对象，该对象包含每个关键帧的对应的 CSSKeyFrameRule 对象。

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

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

let myRules = document.styleSheets[0].cssRules;
let keyframes = myRules[0]; // CSSKeyframesRule
console.log(keyframes[0]); // 表示单个关键帧的 CSSKeyframeRule。

规范

浏览器兼容性

参见

• @keyframes
• CSSKeyFramesRule