ios下overflow:hidden 无效原因及解决方案
在ipad和ios上设置overflow:hidden不起作用，目前网上找到的方法是给父级元素添加position:fixed，比如这样：
body {
height: 100%;
overflow: hidden;
width: 100%;
position: fixed;
}
原因暂时还没想清楚，网上也没有针对这方面的具体解释，等找到了回头来更新
在Stack Overflow上找到了大概的原因，翻译如下：
overflow的实现原理：
整个
viewport的overflow是由html中的overflow来决定的；假如你不去设置
html的overflow（也就是默认的visible属性），而去设置body的overflow:hidden，也是可以的；-
假如你设置了
html的overflow属性的值（除去默认的visible），那么body的overflow属性就不会生效了/*body的overflow设置无效*/ html{overflow: hidden;} body{overflow: scroll;}
上面的几点在大部分的现代浏览器里都是成立的，但ios下的除外，包括iphone和ipad
ios认为（玛德，标准制定者就是任性），网页内容是个整体，需要将所有的都显示出来，所有overflow就不该起作用，这是他们刻意的，不是bug，而且在更高版本的ios7,8,9中也是这样设定的（mmp）.
对viewport我们没法改变，但是我们可以通过改变body自身的overflow：
- 改变html的overflow默认属性（
visible）为auto或者hidden，哪个都行，对后面的效果都是一致的，这样body就不会继承viewport的overflow属性，然后通过设置body的overflow:hidden，大部分的溢出内容就会被隐藏掉 - 不过设置了
position:absolute的除外，因为它默认是相对viewport进行绝对定位的，这个时候你要对body进行设置position:relative
总结起来一句话，body的范围要比viewport的范围要大，这样才能使body的overflow生效
达到这个效果：
- body需要设置viewport的宽高：
body{width:100%;height:100%} - html和body的padding，margin都不能有；html的border也不能有
- 给body加上
box-sizing: border-box，解决padding的问题（这里没咋看懂，把原文贴一下：Finally, in order to deal with body padding, and in case you ever want to set a border on the body, make the math work with box-sizing: border-box for the body.）
最后的代码整理如下：
html {
overflow: hidden;
height: 100%;
margin: 0;
padding: 0;
border: none;
}
body {
overflow: hidden;
position: relative;
box-sizing: border-box;
margin: 0;
height: 100%;
}
over!
