在移动设备上制作网站页面大小正常的桌面大小

我在通过对当前网站进行重新编码的途中，遇到了移动兼容性问题。在移动设备上制作网站页面大小正常的桌面大小

如果您通过移动设备查看当前网站（here），则可以看到网站的宽度和高度与在桌面上进行纵向和横向滚动查看时的宽度和高度相同。

然而，在我的新网站（使用bootswatch引导石板 - bootswatch.com/slate/）当你预览它在移动设备上尝试给它的所有挤入固定移动设备宽度（here）

我已经尝试添加下面的几行，但是我没有看到区别。

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

html, 
body { 
    height: 100%; 
    width: 100%; 
    }

有什么办法可以让新网站与移动设备中的当前维度显示在同一维度上？

谢谢。

来源

2014-02-07 user3285828

你看到的是引导程序的响应行为，我猜。而且，在移动设备上将内容嵌入设备宽度当然是有意义的。

你可以读到这里你引导项目禁用响应功能：Disabling bootstrap responsiveness

UPDATE：

为了让您的内容水平滚动地址：

html, body { 
    overflow: auto; 
}

到您的样式表。

如果这不起作用尝试加入!important的声明：

html, body { 
    overflow: auto !important; 
}

注：这不是最有效的方式CSS-性能明智的，但考虑到CSS的您的理解水平，我猜测你自己改变bootstrap.css会太多了。

来源

2014-02-07 23:37:26 Sebsemillia

当我将bootstrap配置为无响应时，我无法在移动设备的网页上进行水平滚动，关于我应该怎么做的任何想法？谢谢。 – user3285828

我更新了我的答案。 – Sebsemillia

对于Bootstrap它自我禁用响应能力的步骤如下。你可以下载这个禁用的模板/ CSS。退房http://getbootstrap.com/getting-started/

步骤禁用页面响应省略的CSS文档中提到覆盖在.container与单一宽度每个网格层的宽度，例如宽度视：970像素重要;确保这是在默认的Bootstrap CSS之后。您可以选择避免！重要的媒体查询或一些选择器。如果使用导航栏，请删除所有导航栏折叠和展开行为。对于网格布局，除了使用.col-xs- *类以外，或者使用.col-xs- *类来代替中型/大型网格。别担心，超小型设备网格可以扩展到所有分辨率。您仍然需要针对IE8的Respond.js（因为我们的媒体查询仍然存在并需要处理）。这会禁用Bootstrap的“移动网站”方面。

来源

2014-02-07 23:35:36

在移动设备上制作网站页面大小正常的桌面大小

回答

相关问题