一条关于将字体大小设置为16px的顶级答案的评论询问了这是如何解决的，如果你想要更大/更小的字体怎么办。

我不知道你们所有人的情况，但使用px来调整字体大小并不是最好的方法，你应该使用它们。

我在我的响应网站上遇到了这个问题，我的文本字段大于16像素。我的表单容器设置为2em，输入字段设置为1.4em。在移动查询中，我根据视口更改html字体大小。由于默认的html是10，我的输入字段在桌面上计算为28px

为了取消自动缩放，我不得不将输入更改为1.6em。这将我的字体大小增加到32px。只是稍微高一点，几乎看不到。在我的iPhone 4和5上，我将html字体大小改为15像素（纵向），改回10像素（横向）。看起来像素大小的最佳点是48px，这就是为什么我从1.4em（42px）改为1.6em（48px）。

你需要做的事情是找到字体大小的最佳位置，然后将其转换为rem/em大小。

我用jQuery也做到了这一点：

$('input[type=search]').on('focus', function(){
  // replace CSS font-size with 16px to disable auto zoom on iOS
  $(this).data('fontSize', $(this).css('font-size')).css('font-size', '16px');
}).on('blur', function(){
  // put back the CSS font-size
  $(this).css('font-size', $(this).data('fontSize'));
});

当然，如果16px的字体大小破坏了设计，则可能需要调整界面中的其他一些元素。

如果你的网站是为移动设备设计的，你可以决定不允许扩展。

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

这解决了移动页面或表单“浮动”的问题。

请不要使用Javascript或黑客来使其工作。这将影响您在网络上的项目分数。

这将起到作用：

input, input:active, input:focus, input:focus-within, input:hover, input:visited {
    font-size: 16px!important;
}

在阅读了这里的几乎每一行并测试了各种解决方案之后，感谢所有分享他们解决方案的人，我在iPhone 7 iOS 10.x上为我设计、测试和工作的内容：

@media screen and (-webkit-min-device-pixel-ratio:0) {
    input[type="email"]:hover,
    input[type="number"]:hover,
    input[type="search"]:hover,
    input[type="text"]:hover,
    input[type="tel"]:hover,
    input[type="url"]:hover,
    input[type="password"]:hover,
    textarea:hover,
    select:hover{font-size: initial;}
}
@media (min-width: 768px) {
    input[type="email"]:hover,
    input[type="number"]:hover,
    input[type="search"]:hover,
    input[type="text"]:hover,
    input[type="tel"]:hover,
    input[type="url"]:hover,
    input[type="password"]:hover,
    textarea:hover,
    select:hover{font-size: inherit;}
}

不过，它也有一些缺点，由于“悬停”状态和“聚焦”状态之间字体大小的快速变化，以及重画对性能的影响，它明显出现了“跳跃”

我看到这里的人用JavaScript或viewport函数做了一些奇怪的事情，并关闭了所有设备上的手动缩放。我认为这不应该是一个解决方案。添加此CSS片段将关闭iOS中的自动缩放功能，而不会将字体大小更改为固定数字，如16px。

默认情况下，我在输入字段中使用93.8%（15px）的字体大小，通过添加CSS代码段，字体大小保持在93.8%。无需更改为16px或将其设置为固定数字。

input[type="text"]:focus,
textarea:focus {
    -webkit-text-size-adjust: 100%;
}