简体   繁体   中英

Chrome for Android: How to enable mobile-friendly ' on web page

I created this http://nl4.christianity24.org/ using PHP and mysqli, with CSS 3. I got website mobile friendly with Android opera but can't get it friendly on Android Chrome and Firefox. What am I suppose to do.

Like use @media(); what is the best CSS 3 format for mobile view point?

To ensure proper rendering and touch zooming for all devices try adding this meta tag in the <head> of your document.

<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

Then you can customize your website using various media queries like this.

// Large devices (desktops, less than 1200px)
@media (max-width: 1199.98px) {
    body {
        background-color: red;
    }
}

// Medium devices (tablets, less than 992px)
@media (max-width: 991.98px) {
    body {
        background-color: yellow;
    }
}

// Small devices (landscape phones, less than 768px)
@media (max-width: 767.98px) {
    body {
        background-color: blue;
    }
}

// Extra small devices (portrait phones, less than 576px)
@media (max-width: 575.98px) {
    body {
        background-color: violet;
    }
}

Hope this will help.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM