In today's world, users view web pages on a wide range of screens. They can range from large displays on their workstation monitors, smaller laptop lcds, to small mobile phone screens on the go.
Added in CSS3, media queries are an excellent way to deliver different styles to different devices, providing the best experience for each type of user. If the user has a browser that supports media queries then we can write CSS specifically for certain situations. For example, detecting that the user has a small device like a smart phone, the corresponding style sheet or style rules are applied giving the device a specific visual layout.
- Adobe Developer Connection - Introduction to Media Queries
- HTMLGOODIES - Introduction to CSS Media Queries
- Mozilla Developer Network - CSS Media Queries