移动端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);
    }
}

版权声明:本文为qq_40958876原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。