HTMLStyleElement: media property

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

The HTMLStyleElement.media property specifies the intended destination medium for style information.

Value

A string describing a single medium or a comma-separated list.

Examples

html

<!doctype html>
<html lang="en-US">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width" />
    <title>Test page</title>

    <link
      id="LinkedStyle"
      rel="stylesheet"
      href="document.css"
      media="screen" />
    <style id="InlineStyle" rel="stylesheet" media="screen, print">
      p {
        color: blue;
      }
    </style>
  </head>
  <body>
    <script>
      alert("LinkedStyle: " + document.getElementById("LinkedStyle").media); // 'screen'
      alert("InlineStyle: " + document.getElementById("InlineStyle").media); // 'screen, print'
    </script>
  </body>
</html>

Specifications

Specification
HTML Standard # dom-style-media

Browser compatibility

	Desktop						Mobile
	Chrome	Edge	Firefox	Opera	Safari	Chrome Android	Firefox for Android	Opera Android	Safari on IOS	Samsung Internet	WebView Android
`media`	1	12	1	≤12.1	1	18	4	≤12.1	1	1.0	4.4

© 2005–2023 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/HTMLStyleElement/media