Mobile development and responsive design are all the rage these days and media queries are mentioned everywhere. It’s a CSS3 extension of the media types frequently used in HTML4 and CSS2. The following (very simplified) example hides an element if the browser device has a max width of 500 pixels.
This is of course only the tip of the iceberg. There are tons of resolutions and variations to consider (for instance have a look at Andy Clarke’s Hardboiled CSS3 Media Queries), media queries are not supported by IE8 or older (live with it) and so on. But when used correctly, media queries can be a powerful tool.
However, media queries are indeed a nice asset when it comes to CSS, but unfortunately they will not prevent the browser from downloading many other things which may be superfluous on mobile devices.
Since many external scripts are large, this could be a problem. For instance, the minified and Gzipped version of JQuery is about ten times smaller in filesize than the regular version. It could also download a lot of images which may be unused on certain devices.