由于iphoneX全面屏保留了小刘海，所以之前很多手机H5页面都需要配合App客户端进行适配，如下：1.Topbanner前的客户端有一直采用状态栏20pt+导航栏44pt的做法。由于iphoneX的刘海特别小，所以iphoneX采用了44pt的状态栏+44pt的导航栏，也就是说内嵌的H5页面整体下移了24pt。2、底部操作栏由于iPhoneX是全面屏，页面底部会被弧形转角切掉一部分，尤其是固定底部浮动的标签会受到严重影响。这时候就需要在底部留一个空白的安全区，页面内容的最后一行应该在手机的一角。安全区域的高度为34pt。3、适配方法如前所述，结合iphoneX目前特有的手机参数，我们可以采用的适配方法是：(1)metatagios11在已有的viewportmetatag上增加了一个新的feature，目的是适配iphoneX:viewport-fit，如果客户端没有做全屏适配，而页面想要全屏覆盖，可以使用这个特性：(2)Mediaquery1.使用constant函数只有设置了viewport-fit=cover才能使用constant函数@supports(bottom:constant(safe-area-inset-bottom)){selector{padding-bottom:constant(safe-area-inset-bottom);padding-bottom:calc(30px(假定值)+constant(safe-area-inset-bottom));//根据实际情况选择适配方式}}2.使用iphoneX特有的机型参数@mediaonlyscreenand(device-width:375px)and(device-height:812px)and(-webkit-device-pixel-ratio:3){#buy{padding-bottom:34px;}}(3)js判断（下面用到Jquery）if($(window).width()===375&&$(window).height()===724&&window.devicePixelRatio===3){#buy{padding-bottom:34px;}}(4)客户端协议也可以请求客户端根据客户端协议查询是否是iphoneX，以保持与客户端的一致性。4、参数解释上面代码中的参数解释如下：safe-area-inset-bottom—ios11的新特性，用于设置安全区域与边框的距离375—iphoneX设备的宽度812—iphoneX设备的高度3—iphoneX设备的分辨率724—iphoneX设备的高度（812）—顶部banner的高度（88）34—底部安全区域的高度以上参数为均以标准1pt=1px计算，若H5页面采用rem方式缩放，则1pt=1px*3（iphoneX分辨率）
