为什么CSS Media Query无法在移动设备上运行，但是在Google Chrome设备模拟器上是的？

Question

从标题开始，我不明白为什么媒体查询在Google Chrome上的模拟器设备上运行，并且它无法在真正的移动设备上运行。

Html元标记

<meta name="viewport" content="width=max-width, initial-scale=1, maximum-scale=1, user-scalable=no">

的CSS：

@media screen and (min-device-width:640px) and (max-device-width:767px){...}

实际上我已经设置了640/768/850/1024的最小和最大分辨率，用于移动设备的屏幕分辨率，但这似乎是一个错误，原因......我还不明白

Answer 1

您应该在元视口中应用设备宽度

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">

Answer 2

CSS应如下所示并检查：

@media screen and (min-width:640px) and (max-width:767px){...}