视口元标记 - 设备宽度不起作用答案

【问题标题】：Viewport meta tag - device width doesn't work视口元标记 - 设备宽度不起作用
【发布时间】：2016-01-24 12:45:08
【问题描述】：

我希望我的网站女巫还没有准备好在整个页面上打开移动设备，如下图右侧的示例所示。

目前它看起来像左侧尺寸的示例，我无法让它按我想要的方式工作。

网站的宽度是 1020，我使用的视口元标记如下：

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

但它不起作用，我从来没有在 mt 设备上看到过这个工作。

知道如何让它按照我想要的方式打开吗？（缩小）

【问题讨论】：

【解决方案1】：

如果您的网站不适合移动设备，则不应输入 initial-scale 值，或删除元视口，您的网站应该看起来如您所愿。

解决方案 1：

删除<meta name="viewport">。但是我不建议这样做，因为不同设备上的默认视口宽度不同，您的网站可能会失去边距。

解决方案 2：

在<meta name="viewport"> 中仅指定width，如下所示：<meta name="viewport" content="width=1020">，这将使您的网站在所有设备上都以正确的方式“缩小”。

【讨论】：

【解决方案2】：

如果您的网站不适合移动设备，请删除视口元标记。如右图所示，它将占据整个屏幕

【讨论】：