请选择 进入手机版 | 继续访问电脑版
欢迎来到爱昵论坛!

爱昵论坛将免费提供最新资源学习交流、常见的解决方案社区平台

 找回密码
 立即注册

QQ登录

只需一步,快速开始

热搜: PS HTML+CSS JS
搜索
查看: 249|回复: 0

移动端H5页面如何适配iPhoneX

[复制链接]

634

主题

687

帖子

2731

积分

管理员

Rank: 9Rank: 9Rank: 9

积分
2731
发表于 2019-3-21 14:47:31 | 显示全部楼层 |阅读模式
需在在HTML中meta视口中添加 viewport-fit=cover
  1. <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0, viewport-fit=cover">
复制代码
使用CSS3媒体查询即可:
  1. /*兼容iphone X*/
  2. @media only screen and (min-device-height: 812px){
  3.     .payments .payments-bot,.pay-key .pay-key-bot{
  4.         padding-bottom: constant(safe-area-inset-bottom);
  5.         padding-bottom: env(safe-area-inset-bottom);
  6.     }
  7. }
复制代码
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

Archiver|手机版|小黑屋|爱昵图库(Inpic) ( 鄂ICP备14000185号-1

GMT+8, 2019-10-22 19:50 , Processed in 0.109375 second(s), 27 queries .

Powered by Inpic

© 2013-2016 Inpic.com.cn

快速回复 返回顶部 返回列表