😅 学习 - 移动设备的安全距离

SLYLXDYMJ

字数：102 字

时长：1 分钟

ios vh 单位有问题，100vh 总会高一块，是因为 ios 算上了底部的 “安全距离”，
同事给了解决办法，非常好用

env(safe-area-inset-top)
env(safe-area-inset-right)
env(safe-area-inset-bottom)
env(safe-area-inset-left)

比如说想定义一个全屏的模态框

div {
  width: calc(100vw - env(safe-area-inset-left) - env(safe-area-inset-right));
  height: calc(100vh - env(safe-area-inset-bottom) - env(safe-area-inset-top));
}