1.设置全屏的方式 viewport-fit=cover 默认值为:auto/contain,全屏值为:cover
<meta name="viewport" content="width=device-width, initial-scale=1.0,viewport-fit=cover">
2.css中设置的constant()专门处理刘海屏问题
constant() 以及 safe-area-inset-top safe-area-inset-right safe-area-inset-bottom safe-area-inset-left 是 iOS 11 webview 新增加的特性,专门用于应对刘海。
body {
padding: constant(safe-area-inset-top) constant( safe-area-inset-right ) constant( safe-area-inset-bottom) constant( safe-area-inset-left);
}
(此处的上右下左四个值为横屏时的方位)
//默认值
safe-area-inset-top=0, safe-area-inset-right=44px , safe-area-inset-bottom=21px, safe-area-inset-left=44px
网友评论