CSS Media Selectors

You can make one web page look and feel differently over many different media types by using the media attribute inside the link element when referring to an external stylesheet.

For example, we are used to linking to a stylesheet using the following syntax:

<link rel="stylesheet" type="text/css"
             href="/library/css/style.css" />

By including a media attribute, we can limit this stylesheet to a particular media type. For example:

<link rel="stylesheet" type="text/css"
             href="/library/css/style.css" media="screen" />

Potentially, this allows us to format our site differently depending on how the user is viewing the page.