html - 视口(viewport)元标记 - 设备宽度不起作用

Question

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

目前它看起来像左边尺寸的例子，我不能让它按照我想要的方式工作。

当网站的宽度为 1020 并且我使用视口(viewport)元标记时，例如:

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

但它不起作用，而且我从未在 mt 设备上看到它起作用。

知道如何让它按照我希望的方式打开吗？ (缩小)

Answer 1

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

解决方案一:

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

解决方案 2:

仅指定 width在<meta name="viewport"> ，像这样:<meta name="viewport" content="width=1020"> ，这将使您的网站在所有设备上以正确的方式看起来“缩小”。