为什么我的响应式设计在移动设备上看起来与将浏览器大小调整到完全相同的分辨率时不同？答案

【问题标题】：Why does my responsive design look different on mobile than it does when I adjust the browser size to the exact same resolution?为什么我的响应式设计在移动设备上看起来与将浏览器大小调整到完全相同的分辨率时不同？
【发布时间】：2015-12-17 05:08:26
【问题描述】：

我已经阅读了一些相关的 StackOverflow 问题：

here、here 和 here，

但我觉得我仍然没有答案。我有一个很棒的响应式设计（非常简单），看起来很棒，但是你在桌面上重新调整浏览器的大小。现在，当我通过 Chrome 检查元素并使用他们的手机预览时，一切都变得如此渺小。背景不像在桌面上那样拉伸。主要内容不会像在桌面中那样填满该区域，即使将浏览器调整为与手机相同的分辨率也是如此。

是的，我已经包含了视口规范。

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

老实说，无论我如何使用宽度，它似乎都不会改变任何东西 - 在桌面浏览器或移动设备上。

为什么网页在手机浏览器中的显示与在桌面浏览器中缩小到完全相同的分辨率时看起来完全不同？

【问题讨论】：

您能给我们一个复制问题的 jsfiddle 或指向实时站点的链接吗？

标签： android html css mobile

【解决方案1】：

也许 user-scalable=0 而不是 no？

content="width=device-width; initial-scale=1; maximum-scale=1; user-scalable=0"

【讨论】：

谢谢，那肯定有效果。不是很理想，而是朝着正确方向迈出的一步。
这是我的移动项目中的内容。这对我有用。略有不同，但值得一试。