缩放视口规范适用于iPhone，但不适用于Android

Question

我不久前从一家帆船公司xssailing.com创建了一个WordPress网站，目前视图端口设置为：

<meta name="viewport" content="user-scalable=yes;width=device-width; initial-scale=0.31; maximum-scale=1.0;"/>

该网站在电脑上运行良好，我可以在iPhone/iPad上进行缩放。当我用kindle访问该网站时，我无法像在其他网站上那样进行缩放。有什么想法吗？

谢谢！

Answer 1

你是对的，它不会缩放。使用默认浏览器在Nexus S上进行测试。

Safari为这个标签定义了非常愚蠢的默认值（宽度正好是960像素，正好是一部不再生产的旧iPhone）。因此，您需要显式指定minimum-scale。通过指定所有三个缩放参数（而不是三个缩放中的两个），您的页面可以很好地缩放：

<meta name="viewport" content="
user-scalable=yes;
width=device-width;
initial-scale=0.31; maximum-scale=1.0; minimum-scale=0.25"/>

还要等待整个页面完全加载，然后再尝试缩放。

---

请注意，这将是一个更强的堆栈交换问题，有一个完整的最小示例，并且没有指向特定网站的垃圾邮件链接。问题和答案的适用范围越广越好！