<meta name="viewport" content="width=device-width, viewport-fit=cover, xxxx">
html,body {
padding-bottom: constant(safe-area-inset-bottom);
padding-bottom: env(safe-area-inset-bottom);
}
.fixed{
padding-bottom: constant(safe-area-inset-bottom);
padding-bottom: env(safe-area-inset-bottom);
background-color: #fff;
}
- 以上情况iphoneX,iphone11机型都适配成功。但是有一种情况没有成功。。就是app嵌入的情况(项目主要是要链接到客户的app中的)。当时项目适配采用的是vw适配,插件链接奉上postcss-px-to-viewport,当时项目底部定位的高度都是固定的值。导致底部布局错乱。
当时的解决方案就是把底部固定的高度(最外层的盒子)取消了,整个高度是用padding来撑开的。
至此问题解决。。。