12. 关于iphone底部安全区域的注意事项

64 阅读1分钟

原文链接:wjhsh.net/znegkaishen…

  1. H5网页设置viewport-fit=cover

2.使用env()constant(),是IOS11新增特性,Webkit的css函数,用于设定安全区域与边界的距离,有4个预定义变量:

-   safe-area-inset-left:安全区域距离左边边界的距离
-   safe-area-inset-right:安全区域距离右边边界的距离
-   safe-area-inset-top:安全区域距离顶部边界的距离
-   safe-area-inset-bottom :安全距离底部边界的距离

最后页面底部会留出空白的安全区域

image.png