Using CSS media queries allows you to design responsive layout in your web apps and website. We will go over the media query basics in this lesson.

 

body{
       background-color: limegreen;}/*    @media not|only mediatype and (expression)        CSS-Code*/@media (min-width: 600px){
       body{        background-color: pink;    }}@media (max-width: 300px){
       body{        background-color: red;    }}@media (min-width: 400px) and (max-width: 500px){
       body{        background-color: yellow;        color: black;    }}