Set Media Queries for different CSS style rules for different size devices

CSSWeb DevelopmentFront End Technology

To set media queries for different CSS style rules, you can try to run the following code −


Live Demo

         body {
            background-color: lightpink;
         @media screen and (max-width: 420px) {
            body {
               background-color: lightblue;
      <p>If screen size is less than 420px, then it will show lightblue color, or else it will show light pink color</p>
Published on 02-May-2018 07:43:57