Media Queries

media_queries.css

/* Adds a black background to small phones */
body {
  background: #000;
}

/* Adds a pink background to XL phones */
@media (min-width: 640px) {
  body {
    background: rgb(210, 61, 224);
  }
}

/* Add a red background to tablets */
@media (min-width: 768px) {
  body {
    background: rgb(202, 20, 20);
  }
}

/* Adds a green background to laptops */
@media (min-width: 1024px) {
  body {
    background: rgb(62, 218, 42);
  }
}

/* Adds a blue background to full HD screens */
@media (min-width: 1280px) {
  body {
    background: rgb(34, 23, 185);
  }
}