javascript - IOS 防止缩放文本输入

Question

如何防止在 IOS 中对文本输入进行缩放？我知道之前有人问过这个问题，传统观点是输入时至少要有 16px 的字体。

然而，这似乎不适用于现代 ios 设备(最近的 iphones)，尽管它似乎适用于旧的 ipad。

目前有什么解决方案吗？我最好寻找 css 或纯 javascript 解决方案。

我知道我们可以为页面完全禁用缩放，但这不是理想的解决方案。

Answer 1

您是否尝试指定所有输入并添加 focus 属性，如下所示:

@media #{$small-and-down} {
  // styles for small screens and down
  input[type="color"],
  input[type="date"],
  input[type="datetime"],
  input[type="datetime-local"],
  input[type="email"],
  input[type="month"],
  input[type="number"],
  input[type="password"],
  input[type="search"],
  input[type="tel"],
  input[type="text"],
  input[type="time"],
  input[type="url"],
  input[type="week"],
  select:focus,
  textarea {
   font-size: 16px !important;
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
  select:focus,
  textarea:focus,
  input:focus {
    font-size: 16px !important;
  }
}