CSSKeyframesRule: cssRules property
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.
The read-onlycssRules property of theCSSKeyframeRule interface returns aCSSRuleList containing the rules in the keyframesat-rule.
Note:TheCSSKeyframeRule itself is indexable like an array, and functions similarly to itscssRules property.
In this article
Value
Examples
The CSS includes a keyframes at-rule. This will be the firstCSSRule returned bydocument.styleSheets[0].cssRules.myRules[0] returns aCSSKeyframesRule object. ThecssRules property returns aCSSRuleList containing two rules.
css
@keyframes slide-in { from { transform: translateX(0%); } to { transform: translateX(100%); }}js
let myRules = document.styleSheets[0].cssRules;let keyframes = myRules[0]; // a CSSKeyframesRuleconsole.log(keyframes.cssRules); // a CSSRuleList object with two rulesSpecifications
| Specification |
|---|
| CSS Animations Level 1> # dom-csskeyframesrule-cssrules> |