移动端H5适配iphoneX底部栏,css快速解决方案

1、meta标签放入viewport-fit=cover

<meta name="viewport" content="width=device-width...... viewport-fit=cover">

2、css设置(不要忘记将底部栏放上“footer”这个class类名)

@supports (bottom: env(safe-area-inset-bottom)){
    body,
    .footer(底部栏){
        padding-bottom: constant(safe-area-inset-bottom);
        padding-bottom: env(safe-area-inset-bottom);
    }
}

你可能感兴趣的:(IOS兼容,css)