How does browser choose media type to filter CSS links?

A page on my site has a link to a stylesheet for media="print".

<link rel="stylesheet" href=".../print.css" type="text/css" media="print" /> 

Most browsers correctly ignore this link when rendering for a screen, but IE7 includes the file and processes the style rules, rendering the page inappropriately for a screen display.

How does IE (and how do other 开发者_C百科browsers) recognize what the intended display is? Is there an HTML header (or absence of) that guides them? Can this be correctly with Javascript?

Use the @import at-rule instead to include the file only for print and bypass IE7:

<style type="text/css" media="print">
@import "print.css";
</style>

If that does not work, try the other alternatives on the media test page