Safari H5适配问题

1、 Safari 下 html 100% !== 100vh
参考 https://github.com/mui-org/material-ui/issues/12285
100vh 包含工具栏的高度；
100% 不含工具栏的高度 (即 视口高度)
元素进行绝对定位时， 若relative 元素是body， 绝对定位 top：0 ， bottom: 0 表现高度同 body 的高度， 即 100% ， bottom:0 为工具栏的上部； 100vh bottom:0 对应 工具栏的底部；
所有浏览器对于 100% 的解释相同： 即100% 是可见的视口高度 （测试为 window.innerHeight）；

2、Safari 中禁止页面滚动

html, body {
  height: 100%;
  overflow: hidden;
}

3、Mobile Safari 10.0 之后 ignore了”user-scalable=no”的设定

以CSS touch-action: manipulation禁止double-tap手勢

html, body {
  touch-action: manipulation;
}

touch-action: manipulation; 禁止了双击方法， 禁用双击可缩放功能可减少浏览器在用户点击屏幕时延迟生成点击事件的需要，可以正常使用click， 也解决了点击穿透的问题；

移动端浏览器，比如IOS10以上的Safari，安卓系统下的UC浏览器、QQ浏览器等，为了更好的用户体验，并没有遵循开发者禁止缩放的指定，虽然meta标签 ”user-scalable=no”写法，但依然允许用户双指缩放和双击放大。

4、祖先元素应用 relative/absolute 定位后 ， 再应用z-index ，除 z-index： auto 外， safari 下 fixed 异常；
祖先元素应用 Fixed 定位，其fixed 的子元素正常；