IOS防止缩放文本输入

Question

如何防止在IOS中缩放文本输入？我知道之前已经问过，传统的观点是输入上至少有16px的字体。

然而，这似乎不适用于现代ios设备（最近的iphone），虽然它似乎适用于较旧的ipad。

目前有哪些解决方案？我最好是寻找一个CSS或纯JavaScript解决方案。

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

Answer 1

您是否尝试指定所有输入并添加了焦点属性，如下所示：

@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;
  }
}