The media query is the philosopher's stone of responsive design. With its logical expression, you can create a webpage that responds and transforms to fit different viewports. A media query contains a media type and one or more expressions that, if true, can invoke new CSS attributes for that expression.
There are possibly hundreds of permutations of these expressions; for a moment, take a look at the W3C website for the possible attributes. All of these are available for you to browse through over at http://www.w3.org/TR/css3-mediaqueries/. Here's that list for easy reference:
width: This describes the width of the targeted viewport of the device. It can accept