移动端适配问题
web页面怎么对iphone x系列机型做安全区域的适配??目前手机底部会有阴影
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

发布评论
评论(3)
葬シ愛2022-09-18 20:12:49
if (/iPad|iPhone|iPod/.test(window.navigator.userAgent)) {
document.body.classList.add('ios');
if (screen.width == 375 && screen.height == 812) {
document.body.classList.add('iphone-x');
}
if (screen.width == 414 && screen.height == 896) {
document.body.classList.add('iphone-xr');
}
}
~没有更多了~
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
在
meta name="viewport"
改成<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, viewport-fit=cover" />
关键就是viewport-fit=cover"
,它会使页面占满整个屏幕,然后你可以配合constant(safe-area-inset-bottom)
对底部做一些操作了