css - 在 chrome 中设置 css constant() 或 env() 变量以进行调试

Question

我有这样的 CSS:

#something {
  top: 0;
  top: constant(safe-area-inset-top);
  top: env(safe-area-inset-top);
}

(改变移动浏览器上的 View )

有没有办法设置safe-area-inset-top值为 constant或 env桌面上 chrome 中的变量以进行调试/测试？

Answer 1

也许会有更好的答案，但现在我发现最好的方法是简单地使用变量作为解决方法:

:root {
  --safe-area-inset-top: 20px;
}

#something {
  top: 0;
  top: constant(safe-area-inset-top);
  top: env(safe-area-inset-top);
  top: var(--safe-area-inset-top);
}