Bootstrap用于高分辨率显示器

时间:2014-11-07 23:41:34

标签: twitter-bootstrap-3

请在将此称为重复之前,并将其拒绝阅读! 我知道这个解决方案(twitter bootstrap for high resolution mobile displays)并且我已经使用了它,但当我指向使用三星S5(高分辨率移动设备)的网站时它会呈现平板电脑视图而不是移动设备。

除了使用viewport initial-scale = 1或使用上述问题中提到的CSS之外的任何其他可能的解决方案?

阿米尔

2 个答案:

答案 0 :(得分:1)

我发现了这个问题! 它非常奇怪和有趣,所以我分享给可能有同样问题的每个人。

使用视口的解决方案工作正常问题实际上是移动设备导航到网站的方式!我在我的域名注册商(Godaddy)上进行了永久重定向,以便将访问者重定向到实际部署,这似乎是个问题!

所以这是细节。我的域名是aaaa.com,我的代码部署在bbbb.com/aaawebsitecontent下 在aaaa.com域名注册表中,我有一个永久重定向,用于将任何请求重定向到aaaa.com,转到bbbb.com/aaawebsitecontent。如果我将手机浏览器指向aaaa.com,则视口无法正常工作!由于某种原因,它仍然显示高分辨率的桌面布局!如果我将我的移动浏览器指向bbbb.com/aaaawebsitecontent,那么一切正常,系统切换到移动布局!

我真的无法解释原因,但无论我知道问题的根本原因!

答案 1 :(得分:0)

我一直在为我创建的每个网站使用Bootstrap basic template,但我还没有遇到过问题。我拥有与S5相同分辨率的三星Galaxy S4,所以不应该有区别。你也应该尝试一下。如果您在创建某个网站时遇到问题,可以附上一些代码,以便我们查看。

正如您在此处看到的那样,<meta>标记(我希望scale=1scale=1.0之间没有区别),就像你已经链接的问题一样,是的,它是可能是重复的问题。

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Bootstrap 101 Template</title>

    <!-- Bootstrap -->
    <link href="css/bootstrap.min.css" rel="stylesheet">

    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
  </head>
  <body>
    <h1>Hello, world!</h1>

    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
    <!-- Include all compiled plugins (below), or include individual files as needed -->
    <script src="js/bootstrap.min.js"></script>
  </body>
</html>