移动端安全区 CSS

生成 viewport-fit=cover、安全区补边和 100dvh 回退样式。

输入与结果示例

基础补边 16px、底栏 56px，复制 meta 与 CSS 到页面对应位置。

使用范围与注意事项

• 输入在浏览器本地处理，不上传、不默认保存。
• 依赖目标浏览器提供 env(safe-area-inset-*)；普通矩形屏幕可能为 0。
• 保留用户缩放；动态键盘、横竖屏切换与固定底栏需要真机验证。

常见问题

能直接保证所有设备适配吗？

不能，工具生成与计算辅助方案；上线前仍需检查目标设备、用户字体设置与目标浏览器。