我一直在响应式网站上工作。我一直在使用Chrome开发人员工具将屏幕尺寸覆盖为320px，并使用媒体查询来更改CSS。这是我使用的媒体查询：
@media only screen
and (max-width : 480px) {
在我的浏览器上，这可以正常工作，并且我得到了它（将视口设置为320 x 480px）：
但是，在iPhone 5上查看时，这是结果，它与全宽版本] 2相同：
您可以查看完整的媒体查询CSS here
最佳答案
加上这个
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
在您的
<head>标记中。这意味着您的网站将缩放到设备宽度，而不是默认宽度。
关于iphone - 手机媒体查询-宽度错误，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/16014489/