Html 媒体查询CSS

由于某些原因，当从iphone或移动设备查看时，我的媒体查询无法正确调整网站的大小，我在iphone上获得了该网站的平板电脑版本。媒体查询在平板电脑上运行良好，在缩小浏览器窗口时效果最佳

我错过什么了吗

@media only screen and (min-width: 1024px) {
/*styling here*/
}

@media only screen and (max-width: 1023px) and (min-width: 740px) {
/*Tablet styling here*/
}

@media only screen and (max-width: 739px) and (min-width: 0px) {
/*Mobile styling here*/
}

退房， 让我知道它是否有效

---

您需要指定设备宽度。

我认为您可能需要将其指定为“最小设备宽度”

@media only screen and (max-device-width: 739px) and (min-device-width: 0px) {
    /*Mobile styling here*/
}

---

我觉得不错。您可以尝试使用骨架较少的样式表：确保移动浏览器希望提供站点的移动版本。如果用户选择不这样做，浏览器将使用更大的屏幕宽度并解析正常样式表。尝试先为小型设备编写，然后为更高的分辨率编写&使用元视口。希望所有这些都能帮助您。使用设备宽度似乎不起作用，可能是因为我使用的是一个名为MITE的虚拟测试仪？