files/en-us/web/api/cssimportrule/media/index.md
{{APIRef("CSSOM")}}
The read-only media property of the {{domxref("CSSImportRule")}} interface returns a {{domxref("MediaList")}} object representing the media query list of the {{cssxref("@import")}} rule.
A {{domxref("MediaList")}} object.
Although the media property itself is read-only in the sense that you can't replace the MediaList object, you can still assign to the media property directly, which is equivalent to assigning to its {{domxref("MediaList/mediaText", "mediaText")}} property. You can also modify the MediaList object using the {{domxref("MediaList/appendMedium", "appendMedium()")}} and {{domxref("MediaList/deleteMedium", "deleteMedium()")}} methods.
The following stylesheet includes a single {{cssxref("@import")}} rule. Therefore the
first item in the list of CSS rules will be a CSSImportRule. The
media property returns a {{domxref("MediaList")}} object. This includes
the mediaText property with a value of screen.
@import "style.css" screen;
const myRules = document.styleSheets[0].cssRules;
console.log(myRules[0].media); // A MediaList
To change the media attribute of the associated stylesheet, set the value of media to a string containing the new value.
const myRules = document.styleSheets[0].cssRules;
myRules[0].media = "print";
{{Specifications}}
{{Compat}}