Question

我有这个奇怪的问题。我刚刚在自己的Web服务器上设置了一个使用bootstrap 3.0.3构建的页面。

我的问题是响应部分，它在chrome和firefox中运行良好，甚至在我通过dropbox建立公共链接时也可以在我的手机上运行。但当我尝试使用我的手机，三星galaxy s3从我的网络服务器访问它时，它停止工作。我得到整个页面而不是缩小到移动版本。

我已经包含了视口：

<meta name="viewport" content="width=device-width, initial-scale=1">

在googles页面速度页面上运行测试时，出现错误，指出视口不存在。

我的网络服务器在带有nginx的覆盆子pi上运行。

Answer 1

最后！来自Responsive website zoomed out to full width on mobile：

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

Answer 2

您是否使用网址框架（蒙面转发）将您的域名重定向到您的网络服务器？我遇到了和你一样的问题:(当通过远程服务器访问我的网站时，没有响应移动设备。

通知网址框架可能包含<frame>或<iframe>，在这种情况下，移动设备，平板电脑等设备的响应部分无法使用。

Answer 3

您使用的是自举文件的本地副本还是远程？

尝试使用以下内容包含文件：

<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css">
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap-theme.min.css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>

如果它有效并且您之前尝试使用本地文件，那么链接到本地文件可能会出现问题。如果其中一个是404'，请尝试在浏览器中使用调试控制台进行检查。如果是这样......你必须修复链接。

Answer 4

确保你有

<!DOCTYPE html>

作为代码中的第一行发送

移动设备上的Bootstrap响应能力

4 个答案: