/Web APIs

CSSImportRule: supportsText property

Experimental: This is an experimental technology
Check the Browser compatibility table carefully before using this in production.

The read-only supportsText property of the CSSImportRule interface returns the supports condition specified by the @import at-rule.


A string, or null.


The document's single stylesheet contains three @import rules. The first declaration imports a stylesheet if display: flex is supported. The second declaration imports a stylesheet if the :has selector is supported. The third declaration imports a stylesheet without a supports condition.

The supportsText property returns the import conditions associated with the at-rule.


@import url("style1.css") supports(display: flex);
@import url("style2.css") supports(selector(p:has(a)));
@import url("style3.css");


const myRules = document.styleSheets[0].cssRules;
console.log(myRules[0].supportsText); // returns `"display: flex"`
console.log(myRules[1].supportsText); // returns `"selector(p:has(a))"`
console.log(myRules[2].supportsText); // returns `null`


Browser compatibility

Desktop Mobile
Chrome Edge Firefox Internet Explorer Opera Safari WebView Android Chrome Android Firefox for Android Opera Android Safari on IOS Samsung Internet
supportsText No No 114 No No No No No 114 No No No

See also

© 2005–2023 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.