移动设备上的Bootstrap响应能力

Question

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

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

我已经包含了视口：

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

在googles页面速度页面上运行测试时，我收到一条错误，指出视口不存在。

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

Answer 1

最后！ 从响应式网站缩小到移动设备的全宽 ：

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

Answer 2

您是否使用URL Frame（Masked Forwarding）将域重定向到Web服务器？ 我遇到了和你一样的问题:(当通过远程服务器访问我的网站时，没有响应设备作为移动设备。

注意URL框架，可能包括<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>

作为代码中的行发送