简单的引导页面在iPhone上不响应
我下载了Twitter Bootstrap示例，并用它创build了一个简单的rails项目。 我在需要的地方复制了CSS并显示正常。 我还复制了js和桌面上的所有东西：当我改变浏览器的大小时，它重新组织页面。 当使用不同大小的“响应式devisetesting工具”时，效果很好。
我的问题是在我的iPhone上：它显示在我的桌面上。
当我尝试引导英雄示例页面（这是我开始），它对我的iPhone很好。
有什么可能出错？ 我几乎没有碰到任何CSS，我只是在页脚上添加了填充。
仅供参考，我改变的CSS是我的应用application.css链接到application.css与以下内容：
/* Application stylesheet */ @import url(bootstrap.css); @import url(bootstrap-responsive.css); /* Body */ body { padding-top: 60px; padding-bottom: 40px; } /* Footer */ footer { padding: 20px 0; }
确保你添加：
<meta name="viewport" content="width=device-width, initial-scale=1.0">
到你的<head> 。
我有一个类似的问题，我错误地认为这只是一个视口宽度的问题。
更新 ：检查@NicolasBADIA答案更完整的版本。
在横向视图中打开设备时，frntk提出的代码不起作用，而virtualeyes提供的解决scheme不正确，因为它使用分号而不是逗号。 这里是正确的代码：
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
来源： https ： //developer.mozilla.org/en/Mobile/Viewport_meta_tag
当然，一个非常小的案例，但值得一提的。
如果您通过您的DNS提供商使用域名转发，您的网站最终可能会封装在一个iframe中。 例如，GoDaddy使用这种技术，如果你掩盖你的域名和转发。
我被困在这个问题上好几个小时了。
别忘了将内容放在<div class="container-fluid">...</div>
添加在你的头标记它在任何设备上的工作酷响应确保添加使用全宽调整响应
