公告列表
公告列表
收藏
回答

关于 env(safe-area-inset-bottom)的适配问题？

如果才能做到iPhone全面屏情况下使用env(safe-area-inset-bottom)来适配底部安全距离，而如果是其他的安卓手机或IPhone手机，底部安全距离设置固定值，比如40rpx，因为iPhone的env(safe-area-inset-bottom)底部安全距离已经足够大了，如果使用calc(40rpx + env(safe-area-inset-bottom))，虽然安卓机或其他iPhone手机底部看起来挺协调，但iPhone的全面屏底部的空缺就会非常的大，请问有解决方法嘛？难道通过js判断当前设备的安全距离嘛

回答关注问题邀请回答
收藏

1 个回答

  • 浪花骑士
    浪花骑士
    2023-07-19

    iPhone的全面屏底部的空缺就会非常的大:

    你写calc(40rpx + env(safe-area-inset-bottom))的话,肯定会非常大啊

    因为你在本身安全距离的基础上又加了40rpx

    你直接写env(safe-area-inset-bottom);不就行了?

    有安全距离的时候,就是安全距离本身,没有的时候,就是没有

    2023-07-19
    有用 1
    回复 3
    • theL07
      theL07
      2023-07-19
      感谢您的回答，但我想要的效果是padding-bottom在iPhone全面屏设置了env(safe-area-inset-bottom)，而非全面屏或是安卓手机，padding-bottom设置的则是固定的值，例如40rpx
      2023-07-19
      赞
      回复
    • 似水流年
      似水流年
      2023-07-19回复theL07
      max(env(safe-area-inset-bottom, 40rpx)，取最大值，例如inset-bottom为0，padding-botton即为40rpx
      2023-07-19
      赞 3
      回复
    • theL07
      theL07
      2023-07-19回复似水流年
      感谢！有效！省事！比心！
      2023-07-19
      赞
      回复
请 登录 后发表内容
相关问题
相关文档