如何使用 html5-boilerplate 创建一个仅限桌面的网站？答案

【问题标题】：How to create a desktop only website using html5-boilerplate?如何使用 html5-boilerplate 创建一个仅限桌面的网站？
【发布时间】：2013-08-15 13:02:32
【问题描述】：

我过去常常使用html5-boilerplate 开始我的工作，而不是从头开始创建文件。这对于响应式网页设计来说很棒。

我正在开发non-responsive website，客户也需要手机桌面版本（还记得几年前网站是如何在手机上打开的）。

我没有让它响应，也没有在媒体查询中添加任何样式。

我在台式机上工作得很好，但是当我们在移动设备（或小于 940 像素宽的屏幕）上看到该网站时，它不会显示全宽容器的完整背景（即 100%），而是只显示background according to width of device。

我不确定，但我认为以下代码存在问题，即元视口：

<meta name="viewport" content="width=device-width" />

我删除了这段代码并测试了网站，但问题仍然存在。谁能告诉我解决办法？

注意：我已经建立了大部分网站，现在我不能从头开始编写标记。

【问题讨论】：

标签： css html meta html5boilerplate

【解决方案1】：

我找到了一个最简单的解决方案，它对我有用。我刚刚将以下代码添加到 CSS 文件中（我在 main.css 底部的媒体查询部分，以防 html 样板）。

@media only screen and (max-width: 900px) {
    /* Style adjustments for non responsive websites */
    body{width:940px;}
}

【讨论】：

【解决方案2】：

尝试将其更改为以下内容：

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

让我知道它是否有效！

【讨论】：

为什么 max-scale=1？你不觉得它会让用户无法放大吗？
是的 - 如果您希望缩放设置在移动设备上切换方向时保持一致，请包含它。但如果您不这样做 - 尝试不使用但仍包括初始比例。
它不起作用，因为我拥有的元素的宽度为 100%。