meta 标签
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no,viewport-fit=cover"/>
html 添加样式
:root {
--safe-header-top: 20px;
--safe-content-top: calc(45px + 20px);
--safe-padding-bottom: 0;
}
@supports (height: constant(safe-area-inset-top)) {
:root{
--safe-header-top: constant(safe-area-inset-top);
--safe-content-top: calc(45px + constant(safe-area-inset-top));
--safe-padding-bottom: constant(safe-area-inset-bottom);
}
}
@supports (height: env(safe-area-inset-top)) {
:root{
--safe-header-top: env(safe-area-inset-top);
--safe-content-top: calc(45px + env(safe-area-inset-top));
--safe-padding-bottom: env(safe-area-inset-bottom);
}
}