Working with media queries allows you to build responsive websites that can retrofit themselves to look good on virtually any size device. From a smartphone to a video game console browser, with media queries you can specify unique style for any dimension.

Here’s an example of how to work with media queries in your stylesheet.

@media screen and (width:960px) {
  #respond{background:red;}
}

@media screen and (min-width:760px) {
  #respond{background:green;}
}

@media screen and (max-width:480px) {
  #respond{background:blue;}
}

View the media query in action on my CodePen. Resize the window to see the DIV’s background change color.