CSS 安全区域属性在 iPhone X 上不起作用

Question

在我的例子中，我在 iPhone X 上运行一个网络应用程序，我试图在顶部添加一个填充以使用 Webkit 的安全区域 css 属性将我的身体推到安全区域 padding-top: constant(safe-area-inset-top); 和 padding-top: env(safe-area-inset-top); 。然而，网络视图没有正确评估这些属性，它总是设置为 0。我应该怎么做才能让它工作！代码 ：

 body {
padding-top: 44px;
    padding-top: constant(safe-area-inset-top);
    padding-top: env(safe-area-inset-top);
}

原文由 Oussama Haff. 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

它需要

<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover">

在 HTML 的头部

原文由 Albi Patozi 发布，翻译遵循 CC BY-SA 4.0 许可协议