媒体查询不适用于手机

Question

我对媒体查询有疑问（首次使用）。 http://swiatek.org.pl/-2/ 当我更改浏览器窗口时，它们正在工作，但是当我查看chrome媒体查询上的检查切换设备工具栏时，它们不起作用:(。 CSS：http://swiatek.org.pl/-2/main.css

Answer 1

在声明媒体屏幕时添加“仅”一词。

@media only screen and (max-width: 880px) {
    #first header{
        font-size: 55px;
    }
}

您可以在此处了解更多信息：https://www.w3schools.com/cssref/css3_pr_mediaquery.asp

Answer 2

您缺少meta标记，请将其添加到标题中。

<meta name="viewport" content="width=device-width, initial-scale=1">

Answer 3

替换

perl -ne 'print unless /"\$ref:"/' file.json > new_file.json

与

@media screen and (max-width: 1000px)

并替换

@media only screen and (max-width: 1000px) 

与

@media screen and (max-width: 880px)