输入文本在 iphone safari 和 chrome 浏览器中不可见答案

【问题标题】：Input text is not visible in iphone safari and chrome browser输入文本在 iphone safari 和 chrome 浏览器中不可见
【发布时间】：2021-06-03 16:18:02
【问题描述】：

In this, breaktime label have input field, while I typed in this input field, It is not visible in iphone.[All input field in this project]

当我在输入字段中输入时，它在 chrome、safari、firefox 等 iPhone 浏览器中不可见，但在 android 浏览器中运行良好。

【问题讨论】：

你能分享你的代码吗？

标签： html css iphone google-chrome safari

【解决方案1】：

不知道确切原因，但字体系列有问题。如果我将字体系列显式添加到这些输入或它们的容器中，例如：

.timegroup {
  font-family: Arial; //or Helvetica, or whatever
}

它适用于 iPhone 浏览器。

【讨论】：

可以确认此修复适用于桌面 Mac 上的 Chrome。也无法解释为什么。该问题只是间歇性发生，可能不到十分之一的页面刷新，因此更难调试。
谢谢娜塔莉亚。太棒了..这是字体系列问题。
Natalia 你是怎么解决这个问题的？你以前遇到过这个问题吗？
@FasithA 不，我没有 =) 我认为文本不可见并没有太多原因，所有这些都与字体样式有关：文本颜色、字体-大小，字体系列。因此，我尝试使用所有这 3 个参数，更改字体系列会有所帮助！
@Natalia.. 好举动.. 谢谢

【解决方案2】：

由于 Font-family:Gotham，此问题在 iphone 中发生。您可以更改输入字段的字体系列，它可以在 iphone 浏览器中正常工作。

【讨论】：

【解决方案3】：

在您的 CSS 中将 transform 属性添加到 input：

transform: translateZ(0);

【讨论】：