Question

我正在使用

行

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

但它似乎并不想在海豚或Android股票浏览器中实际工作。

有没有人有过这种体验或者视口与这些浏览器不兼容？

编辑：我希望将浏览器设置为显示100％的页面，不显示缩放，只显示页面。设置比例与我需要的相反，用户需要能够缩放。

Answer 1

W3C recommends this：

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

是的，我知道，它是从2010年开始，但我找不到更新的版本

它适用于我测试过的所有机器人;也适合海豚。如果你想真的确保即使是非常过时的微软设备也能获得它，你也可以添加：

<meta name="HandheldFriendly" content="true"/>
<meta name="MobileOptimized" content="320"/>

至少使用这三个都不会有害，尽管最后两个几乎永远不会相关。

编辑：与width=device-width所要求的相反。问题是：缩小是每个移动浏览器的默认行为，考虑到内容不适合。其他任何东西都会适得其反。我在各种网站上尝试使用dolphin而没有任何viewport-meta，它按预期工作。所以您的内容实际上似乎适合，这意味着您的文档width确实等于或小于device-width。例如，如果你......就是这种情况。

...浮动页面内容的关键元素
...之后通过JavaScript（/ Ajax）填充您的内容
......关键元素绝对定位
...对您内容中的一些关键元素有负利润
...具有动态页面宽度，可扩展到窗口宽度

当然还有更多的可能性。不幸的是body { min-width: 800px; }（或者你想成为最小宽度的任何东西）是我现在想到的唯一解决方案。

如果您的内容具有静态宽度，则可以尝试

<meta name="viewport" content="width=980px" />

980px是您的页面宽度。但实际上在这种情况下，文档宽度至少应为980px。因此，视口宽度不可能达到您想要的效果。

不同浏览器上的Meta视口

1 个答案: