共计 570 个字符，预计需要花费 2 分钟才能阅读完成。
在 H5 上适配安全区域： 采用 viewport+env+constant 方案。
具体操作如下：
1. 需要将 viewport 设置为 cover，env 和 constant 才能生效。设置代码如下：
2. 同时设置 env 和 constant 代码，同样 env() 和 constant() 需要同时存在，而且顺序不能换。
这里不一定用 padding-bottom 可以是 margin-bottom 设置，具体看实际情况！
@supports
(bottom: constant(safe-area-inset-bottom))
or (bottom: env(safe-area-inset-bottom)) {
. 盒容器类名 {padding-bottom: constant(safe-area-inset-bottom);
padding-bottom: env(safe-area-inset-bottom);
}
}3. 注意事项：
有一点要注意，在 IOS11.2 系统以前，可以使用 constant() 函数，但是在 IOS11.2 系统以后，这个函数就被废弃了，被 env() 函数替代了。
所以我们在做屏幕适配时，需要这样写：
padding-bottom: constant(safe-area-inset-bottom); /* 兼容 IOS11.2*/ 原文地址: 兼容问题 —ios 底部的安全距离 css 设置
正文完
