移动设备上的网站加载时有轻微缩放，尽管使用了正确的视口元标记。

Question

视口 meta 标签如下：

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

尽管如此，在iphone/ipad上需要手动缩小以适应屏幕。没有最小宽度防止网站缩小以适应屏幕，所以我能想到的是，也许iOS Safari在计算视口大小时没有考虑其垂直滚动条？不管怎样，有没有办法强制它加载时完全缩小，而不禁用整个缩放功能呢？

- Afrophysics

---

有时候只需添加 content="width=device-width, height=device-height, initial-scale=1.0" 就能解决问题 - 试着更改一下，看看是否有效？ - junkfoodjunkie

不起作用，伙计。 - greendino

Answer 1

如果有人好奇，我已经解决了这个问题。

情况：

• 登陆页面有一个登录框，
• iOS会自动聚焦于输入框，因为字体大小小于16px。
• 由于这是一个单页应用程序，视图保持不变。

解决方案：

• 确保您的输入框至少有16px的字体大小，否则iPhone SE等设备会放大以使文本输入更加可见。

- Afrophysics

---

什么是解决方案？我有一个搜索框作为着陆页面。它运行良好。在搜索结果页面上略微放大了一些... - RajGan

哈哈，四年后再读原来的评论，我很感激这次修改。谢谢！ - Afrophysics

Answer 2

这将有所帮助：

@media screen and (device-aspect-ratio: 9/16) { select、textarea、input[type="text"]、input[type="password"]、 input[type="datetime"]、input[type="datetime-local"]、 input[type="date"]、input[type="month"]、input[type="time"]、 input[type="week"]、input[type="number"]、input[type="email"]、 input[type="tel"]、input[type="url"]{ font-size: 16px; } }

- priyank rawat