问题1：iphoneX适配方法。
首先了解一下iphoneX设备基础信息，如下：
iphoneX屏幕组成：上部齐刘海（44px）+ 安全区域（safe area）+ 底部手势区域（34px）。
默认，页面只显示在“安全区域”中，导致屏幕顶部和底部看起来很别扭，此时可以通过如下几种方式进行适配：
1）：设置viewport-fit
viewport-fit可以取两个值contain（默认）或 cover
viewport-fit=contain：页面内容显示在安全区域；
viewport-fit=cover：页面内容显示在整个屏幕；
通常需要设置 viewport-fit=cover，如下：
<meta name="viewport" content="width=device-width,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover">
2）：媒体查询
@media only screen and (device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 3){ //这里写需要调整的样式
}3）：当设置viewport-fit=cover时，如下四个值需要设置，页面才会显示在安全区域中，设置如下：
body {
padding-top: constant(safe-area-inset-top); //为导航栏+状态栏总高度（88px）
padding-left: constant(safe-area-inset-left); //如果未竖屏时，为0
padding-right: constant(safe-area-inset-right); //如果未竖屏时，为0
padding-bottom: constant(safe-area-inset-bottom); //为底部圆弧高度（34px）
}
问题2：使用 $(window).resize(...) 无效。
可能由于框架或插件原因，有时候$(window).resize(...)不生效。
解决方案：使用 window.onresize = function () {...} 即可。
问题3：gif动图附近会闪烁
问题描述：有些手机上，gif动图图片附近会有闪烁现象；
经测试发现，手机卡顿越严重，闪烁越明显，所以基本确定是由于手机卡顿造成的；
解决办法：进可能减少gif动图帧数量，或直接忽略这些卡顿的手机（通常是比较老的机型/系统）。
问题3：ios手机页面里可滚动内容滚动不流畅
问题描述：ios手机上，网页中可滚动区域滚动不流畅，手指滑动多少页面就只滚动多少，没有弹性效果
解决办法：-webkit-overflow-scrolling : touch;
加上上面这段代码即可。