Javascript 当键盘在iPhone中弹出时，Html底部文本区域向上移动过高

我正在用javascript开发一个聊天应用程序，聊天框放在正文的底部，但是当我访问我的html页面时，按下输入元素，文本区域总是向上移动得太高，所以输入元素总是与键盘留下一个小间隙，我想知道如何解决这个问题，谢谢^_^

当前：

但我想要以下效果：

---

任何人遇到这个问题，以及如何解决它（对不起，我的英语很差）

你在页边空白底部尝试过吗：0%；在css中？

请在此处张贴小提琴或您的代码：）