0

我使用 PHP 和 mysqli 以及 CSS 3 创建了这个http://nl4.christianity24.org/。我的网站对 Android 歌剧很友好，但在 Android Chrome 和 Firefox 上却不友好。我该怎么办。

喜欢使用@media(); 移动视点的最佳 CSS 3 格式是什么？

4

1 回答 1

0

为确保所有设备的正确渲染和触摸缩放，请尝试在<head>文档中添加此元标记。

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

然后，您可以使用类似这样的各种媒体查询来自定义您的网站。

// 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;
    }
}

希望这会有所帮助。

于 2018-06-05T09:44:03.467 回答