小程序 iphonex 底部安全区域

safe-area-inset-bottom

https://www.jb51.net/html5/719525.html


1.底部fixed  bottom=0 的菜单或者按钮。可以用padding-bottom: env(safe-area-inset-bottom)解决

.backToTop{position: fixed;bottom:120rpx;right: 30rpx;width: 108rpx;height: 108rpx;border-radius: 108rpx;padding-bottom: constant(safe-area-inset-bottom); padding-bottom:env(safe-area-inset-bottom);}/*回到顶部*/


本身有padding值,把padding-bottom一起计算进去

.safe_fixed_meet{padding: 15rpx 32rpx;padding-bottom:calc(15rpx + constant(safe-area-inset-bottom)); padding-bottom:calc(15rpx + env(safe-area-inset-bottom));}

2.  也可以用高度,加出来安全区域

.tabBar{z-index: 99; padding:10rpx 0;

 height: calc(80rpx + constant(safe-area-inset-bottom));

  height: calc(80rpx + env(safe-area-inset-bottom));

}

3.

你可能感兴趣的:(小程序 iphonex 底部安全区域)