您好,欢迎访问代理记账网站
移动应用 微信公众号 联系我们

咨询热线 -

电话 15988168888

联系客服
  • 价格透明
  • 信息保密
  • 进度掌控
  • 售后无忧

iPhoneX 安全区域 safe-area-inset-*样式不生效

*iPhoneX 安全区域 safe-area-inset-样式不生效
解决办法: 添加 meta name=“viewport” 中增加viewport-fit=cover内容

//viewport-fit=cover
<meta name="viewport" id="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, viewport-fit=cover">
  1. H5页面在ios上面底部安全区域按钮样式兼容
 padding-bottom: constant(safe-area-inset-bottom); /*兼容 IOS<11.2*/
 padding-bottom: env(safe-area-inset-bottom); /*兼容 IOS>11.2*/

注意:样式父元素不能有高度,可以给子元素高度

.vipBtn {
    padding-bottom: constant(safe-area-inset-bottom); /*兼容 IOS<11.2*/
    padding-bottom: env(safe-area-inset-bottom); /*兼容 IOS>11.2*/
    position: fixed;
    width: 100%;
    bottom: rem(0px);
    left: rem(0px);
    background-color: #fff;
    .btn {
      margin: rem(0px) rem(25px);
      color: #fff;
      font-size: rem(32px);
      text-align: center;
      z-index: 999;
      height: rem(100px);
      line-height: rem(100px);
    }
  }

在这里插入图片描述


分享:

低价透明

统一报价,无隐形消费

金牌服务

一对一专属顾问7*24小时金牌服务

信息保密

个人信息安全有保障

售后无忧

服务出问题客服经理全程跟进