<link media=””>

Attribute of
<link> HTML Tag
What does <link media=""> do?
Tells the browser what type of device a resource is designed for.

Defining Devices

When coding in HTML, you may want to use <link> to pull in content from different stylesheets or scripts. The media attribute tells the browser what type of device each script is designed for.

You might use media to tell the browser that you have different stylesheets for display and print. That way, your visitor will see a version that’s optimized for their mobile device when viewing on a small screen, and at the same time, they get will get a different layout when printing.

Specifying the Intended Device

<link rel="stylesheet" type="text/css" href="http://mysite.com/style-print.css" media="print">

You can specify alternate layouts for screen readers, TVs, mobile devices – or even a synthesized voice. A link can have more than one device type specified; separate devices with AND, OR or a comma.

<link rel="stylesheet" type="text/css" href="http://mysite.com/style-display.css" media="screen,handheld">

You will find a complete list of device types for this attribute on the W3Schools website, under the Devices heading.

Claire is an HTML enthusiast.

Browser Support for media