移动文本输入缩放

Posted 2023-05-07

【中文标题】移动文本输入缩放

【英文标题】：Mobile Text Input Zoom

【发布时间】：2022-01-05 16:20:09

【问题描述】：

我意识到这个问题已被多次询问和回答，但我发现没有一个解决方案适合我。

问题在于，在移动设备上查看 Web 应用程序时，自动缩放会聚焦在 text-input 上供用户输入。标准 ios 放大表单元素。

我正在使用通过 cdn 链接提供的 Materialize CSS。

我已经尝试了所有可以找到的视口比例选项，并且我尝试将所有单个元素的字体设置为最小 16 像素，还尝试将 * font-size: 16px !important; 设置为最小。这会更改字体大小，但仍会发生缩放。

我在 CSS 中使用了@media 来缩放一个看起来不错的小屏幕上的按钮，我想知道我是否需要为我的text-input 做点什么？

我能想到的唯一其他事情，但我真的对此一无所知，那就是使用-webkit-。

这是一个特定功能的内部业务应用程序，所以这并不过分，它已经成为一个原则问题。一如既往地感谢任何帮助。

【问题讨论】：

您能解释一下是什么问题吗？另外，将示例代码放入您的问题中，我们可以运行它来自己查看问题。见***.com/help/minimal-reproducible-example

【参考方案1】：

进一步尝试将全局字体大小更改为* font-size: 36px !important; 解决了这个问题。我认为任何超过 32 像素的东西都有效。有点解决方法，但对我的目的有好处。