1：meta头部添加

    <!-- 在 head 标签中添加 meta 标签，并设置 viewport-fit=cover 值 --><meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, viewport-fit=cover"/>

2：在添加安全区的标签里面添加css样式

  padding-bottom: constant(safe-area-inset-bottom); /* 兼容 iOS < 11.2 */padding-bottom: env(safe-area-inset-bottom); /* 兼容 iOS >= 11.2 */

                                                                 适配后

                                                                        适配前