Question

我一直在处理响应式网站。我一直在使用Chrome开发人员工具将屏幕大小覆盖到320px，并使用媒体查询来更改CSS。这是我用过的媒体查询：

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

在我的浏览器上，这是正常的，我得到了这个（将视口设置为320 x 480px）：

enter image description here

然而，当在iPhone 5上观看时，这就是结果，它与全宽版本2相同：

enter image description here

您可以查看完整媒体查询CSS here

Answer 1

添加此

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

在<head>代码中。

这意味着您的网站将缩放到设备宽度而不是默认宽度。