Join the social network of Tech Nerds, increase skill rank, get work, manage projects...
 
  • CSS3 Media Queries

    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 274
    Comment on it

    Media queries is used to make web page responsive i.e. for mobile phones, tablet. It is based on the capability of the device instead of checking only the device width and height.

    It can check the following points:

    • Viewport width and height
    • Device width and height
    • orientation :landscape or portrait mode in the phones or tablets

    Resolution

    It can give style to all Android, iphones and tablets.

    Syntax:

    @media not|only mediatype and (expressions) {
        CSS-Code;
    }
    

    CSS3 Media Types:

    • screen for window screens or mobile-phones or tablets.
    • all for all media type devices
    • print for printers

    Example:

    @media screen and (min-width: 768px) {
        body {
            background-color: red;
        }
    }
    

    This will change the color of the background of the page to red if the viewport width is 480px or above.

 0 Comment(s)

Sign In
                           OR                           
                           OR                           
Register

Sign up using

                           OR                           
Forgot Password
Fill out the form below and instructions to reset your password will be emailed to you:
Reset Password
Fill out the form below and reset your password: