H5页面适配IPhoneX等机型底部横条

1.添加meta头：

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

2.设置CSS样式：

@supports (bottom: env(safe-area-inset-bottom)) {
            body,
            .iphonex(这里的类名绑定到页面的元素中){
                padding-bottom: env(safe-area-inset-bottom);
                padding-bottom: constant(safe-area-inset-bottom);
            }
        }