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

推荐方案，通过设置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">

设置完之后就生效了。