原因分析 · 场景还原 · 解决方案
许多用户和开发者在使用 iPhone 浏览网页或使用 App 时，会发现当点击输入框唤起系统键盘后，键盘上方（即页面底部）多出一行空白区域，导致内容被遮挡或布局错乱。
这种现象在 iOS 的 Safari 或嵌入 Webview 的 App 中尤为常见，尤其在 iOS 12 之后的版本中更为突出。
100vh 在 iOS 中实际高度包含地址栏和工具栏，键盘弹出后视口变化异常。在 <head> 中加入：
<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover">
body {
padding-bottom: env(safe-area-inset-bottom);
}
100dvh（动态视口高度，较新浏览器支持）。点击下方输入框，在 iPhone 上观察是否出现底部空白：
如果你是前端开发者，请务必在真机上测试表单交互，尤其是涉及底部固定按钮、聊天输入框等场景。模拟器有时无法完全复现该问题。
推荐使用 Safari 远程调试功能，连接 iPhone 实时查看布局变化。