Twitter Bootstrap不会在手机上调整(好)

时间:2012-04-03 17:30:07

标签: twitter-bootstrap responsive-design

我在两个项目上使用Twitter Bootstrap,一个是静态HTML网站,另一个是Rails应用程序。当我在桌面浏览器上测试网站时,调整大小是有效的。但是当我在手机[诺基亚E72]上进行测试时,它只是不适合宽度。有趣的是,当我测试bootstrap主页(http://twitter.github.com/bootstrap/)时 - 它也有同样的问题..这只是我吗?我搜索了stackoverflow和谷歌,其他人似乎对他们的手机上的Bootstrap非常满意。

我还测试了替代框架:Foundation - 它似乎工作得更好,并且至少没有水平滚动。

更新:这似乎是我的诺基亚E72上的一个问题。

3 个答案:

答案 0 :(得分:6)

Twitter的引导程序似乎只支持桌面浏览器。

https://github.com/twitter/bootstrap/wiki/Browser-Compatibility

好的,我刚刚发现你需要为android调整大小添加一些东西:

<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="assets/css/bootstrap-responsive.css" rel="stylesheet">

来自http://twitter.github.com/bootstrap/scaffolding.html#responsive

答案 1 :(得分:5)

我不熟悉您的手机(或它的屏幕尺寸),但您可能会发现以下网站在测试您的网站方面非常有用... http://www.responsinator.com/ - 您可能会找到您的屏幕大小帮助解决问题。

答案 2 :(得分:2)

浏览器越流行,使用bootstrap就越好。引用自举文档

  

最初构建时只考虑现代浏览器,Bootstrap已经发展到包括对所有主流浏览器(甚至IE7!)的支持,以及支持Bootstrap 2,平板电脑和智能手机。

诺基亚E72原生浏览器可能不受支持,也不符合标准。您可以尝试使用Opera Mini进行测试。根据{{​​3}},诺基亚浏览器在2011年的使用份额在0.3%到12%之间,而且趋势似乎是它正在失去标记份额。因此,您应该使用Safari,Opera和Android进行测试。