Ray*_*ySF 81 responsive-design twitter-bootstrap
我下载了Twitter Bootstrap示例并使用它创建了一个简单的rails项目.我在需要的地方复制了css,显示效果很好.我也复制了js,一切都在我的桌面上运行得很好:当我改变浏览器的大小时,它会重新整理页面.当使用一些不同大小的"响应式设计测试工具"时,效果很好.
我遇到的问题是我的iPhone:它在我的桌面上显示juste.
当我尝试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;
}
Víc*_*cía 176
确保添加:
<meta name="viewport" content="width=device-width, initial-scale=1.0">
到你的<head>.
我有类似的问题,我错误地认为这只是视口宽度的问题.
更新:查看@NicolasBADIA答案以获得更完整的版本.
Nic*_*DIA 107
当您在横向视图中转动设备时,frntk提出的代码不起作用,并且virtualeyes给出的解决方案不正确,因为它使用分号而不是逗号.这是正确的代码:
<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使用这种技术,如果你正在屏蔽你的域名和转发.
| 归档时间： |
|
| 查看次数： |
61740 次 |
| 最近记录： |