使用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")