CSSKeyframeRule: keyText 属性

Baseline 已广泛支持

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

keyText 属性是 CSSKeyframeRule 接口的一部分，用于表示一个由百分比值组成的、以逗号分隔的动画关键帧选择器列表。from 和 to 关键字分别对应 0% 和 100%。

值

字符串。

异常

SyntaxError: 如果尝试使用无效的关键帧选择器更新 keyText，将抛出异常，并且 keyText 将保持不变。

示例

CSS 中包含一个 keyframes at-rule。这将是 document.styleSheets[0].cssRules 返回的第一个 CSSRule。myRules[0] 返回一个 CSSKeyframesRule 对象，其中包含每个关键帧对应的单独的 CSSKeyFrameRule 对象。

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[0].keyText); // a string containing 0%

规范

规范
CSS 动画级别 1 # dom-csskeyframerule-keytext

浏览器兼容性

帮助改进 MDN

了解如何贡献

此页面最后修改于 2024年10月8日，由 MDN 贡献者进行了修改。

在 GitHub 上查看此页面 • 报告此内容的问题