移动版本差异答案

【问题标题】：Mobile Version Discrepancy移动版本差异
【发布时间】：2017-06-19 15:50:09
【问题描述】：

我正在尝试制作我的第一个个人作品集网站。一切看起来都应该通过浏览器和多个移动模拟器。然而，在我实际的 iPhone 5 上（也检查了其他设备），我看到的是桌面（而不是移动）版本。

我将链接到下面的两张图片，希望能帮助说明我的问题。

我不确定要发布什么实际代码。我的样式文件包含一个@media screen and (min-width:768px)，用于在桌面屏幕上隐藏导航栏标题，我的 html 包含应该响应的引导类。

如果您需要任何特定的代码 sn-ps，请告诉我。同时，我将所有内容都托管在 github 上：(github.com/julianstanley/julianstanley.github.io)

【问题讨论】：

尝试将<meta name="viewport" content="width=device-width, initial-scale=1.0"> 添加到您的HTML
感谢您的评论！我已经在标题中包含该元数据 (github.com/julianstanley/julianstanley.github.io/blob/master/…) 编辑：我刚刚注意到我把 width=divice-width 放在那里。这可能会解决它：如果它有效，我会更新它。
检查了您的网站，其中有多个拼写错误。 content="width=divice-width, inital-scale=1.0"。它说“设备宽度”而不是“设备宽度”。它还说“initial-scale=1.0”而不是“initial-scale=1.0”
好了，解决了！感谢您发现这一点（在我再次发帖之前，我会更加小心地检查是否有错别字！）
当然。快乐编码。以防万一，请始终养成检查开发人员“控制台”选项卡的习惯。这些错别字在那里突出显示。

【解决方案1】：

Nikhil Nanjappa 在上面的 cmets 中回答了这个问题。 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 对观点很重要，虽然我记得把那条线放进去，但我打错了。

【讨论】：