我下载了 Twitter Bootstrap 示例并用它创建了一个简单的 Rails 项目。我在需要的地方复制了 css,它显示得很好。我还复制了 js,一切都在我的桌面上运行得很好:当我更改浏览器的大小时,它会重新组织页面。当使用一些不同尺寸的“响应式设计测试工具”时,效果很好。
我遇到的问题是在我的 iPhone 上:它的显示效果与我的桌面上一样。
当我尝试 Bootstrap Hero 示例页面(这是我开始的页面)时,它在我的 iPhone 上运行得很好。
可能会出现什么问题?我几乎没有触及任何 CSS,我只是在页脚上添加了一个填充。
仅供引用,我更改的 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>
.
我也遇到了类似的问题,我错误地认为这只是视口(viewport)宽度的问题。
更新:查看@NicolasBADIA 答案以获得更完整的版本。
关于twitter-bootstrap - 简单的 Bootstrap 页面在 iPhone 上没有响应,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9386429/