微信小程序webview——设置页面底部安全距离

站长云网 2024-09-28 未知 站长云网

推荐方案,通过设置safe-area-inset-bottom来进行实现:

.footerClass {
  padding-bottom: constant(safe-area-inset-bottom); /* iOS 11.0 */
  padding-bottom: env(safe-area-inset-bottom); /* iOS 11.2 */
}

}
constant 是为了兼容ios 11.0 之前的版本
env是ios 11.2之后的版本

tip
如果发现在真机上不生效,则需要设置viweport-fit 属性

<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover, minimum-scale=1, maximum-scale=1.0, user-scalable=0">

设置完之后就生效了。

责任编辑:站长云网