先来看下iPhone X机型的样子
上图中，Iphonex机型在头部和底部新增了这两个区域，所以我们需要针对这类机型做些适配，方便我们的webapp的展示
h5做成的移动端页面，常见布局为头部+躯干+底部三栏模式，头部和顶部都是固定定位，躯干可里的内容可以滚动，暂定的布局如下：
<div class=page>
<header></header>
<main></main>
<footer></footer>
</div>
但如果没采用IphoneX机型的新的css属性，而直接采用position: fixed;top：0等常规写法，就会出现头部的导航栏被
