CSS - Chrome Mobile - 键盘出现时页面向上移动

Question

我用 ReactJS 实现了一个网页，我有一个带有一些字段的表单，在计算机 Chrome 中它工作正常，但是当我使用平板电脑或智能手机等移动设备进入表单时，当键盘出现时，所有页面都会向上移动我的页面菜单被 Chrome 导航器的导航栏隐藏了。

这是流程：

我脑子里有下一个元数据：

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

该问题仅发生在移动设备的 Chrome 中。

Answer 1

如果我不得不猜测，我会说你有一个margin-top或 aa padding-top设置，其相对单位如vh。我想到这一点是因为当键盘出现时，视口会缩小，这些单元会自行调整，造成这种情况。