javascript - 使用 JavaScript 获取 iPhone X 安全区域

Question

我们有safe-area-inset-left , safe-area-inset-right , safe-area-inset-top , 和 safe-area-inset-bottom在 CSS 中，但是我们如何使用 JavaScript 获取这些值？

Answer 1

来自 https://benfrain.com/how-to-get-the-value-of-phone-notches-environment-variables-env-in-javascript-from-css/ .您可以在链接中找到更多上下文。
在 CSS 中

:root {
    --sat: env(safe-area-inset-top);
    --sar: env(safe-area-inset-right);
    --sab: env(safe-area-inset-bottom);
    --sal: env(safe-area-inset-left);
}

JS内

getComputedStyle(document.documentElement).getPropertyValue("--sat")