css - 如何使用 html5-boilerplate 创建仅限桌面的网站？

Question

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

我正在开发一个无响应的网站，客户也需要手机桌面版本（还记得几年前网站是如何在手机上打开的）。

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

我在台式机上工作正常，但是当我们在移动设备（或小于 940 像素宽的屏幕）上看到该网站时，它不会显示全宽容器的完整背景（即 100%），而是仅根据设备的宽度显示背景。

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

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

我删除了这段代码并测试了网站，但问题仍然存在。任何人都可以告诉我解决方案吗？

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

score 1 · Accepted Answer

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

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

score 1 · Accepted Answer

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

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

让我知道它是否有效！

2 回答 2