解决办法
把需要定位的元素放在父级中的第一个子元素的位置
在实际使用中发现一个兼容性的问题，position:relative是指针对上级目录的相对决定定位，他是浮动在页面上的，但是相对父级是占有空间的，实验证明他们的top属性针对的对象不一致：firefox chome IE7、8等不会出问题，就是针对他的直接parent y坐标定位，但是遨游、腾讯等ie内核的包装浏览器就会不一样，他们针对的是书写位置的上一个直接对象，这样做出来的浮动层在浏览器下就不兼容了，y坐标不统一
手机端css中position定位兼容性解决：<script type="text/javascript">
window.onscroll=function(){
$(".fixed").css("top",$(window).scrollTop())
$(".foot").css("top",$(window).scrollTop()+$(window).height())
}
</script>
1.H5网页touch滑动的时候在苹果手机上出现不流畅的问题
-webkit-overflow-scrolling 用来控制元素在移动设备上是否使用滚动回弹效果.
解决办法：给所有网页添加如下样式
说明：
-webkit-overflow-scrolling: touch当手指从触摸屏上移开，会保持一段时间的滚动
-webkit-overflow-scrolling: auto当手指从触摸屏上移开，滚动会立即停止
2. css 苹果手机按钮默认样式如何去掉
input[type="button"], input[type="submit"], input[type="reset"] {-webkit-appearance: none}
textarea { -webkit-appearance: none}
3. 如果还有圆角的问题，
** 4.苹果手机不支持box-shadow属性**
如果先给input写边框，用 border:1px solid #ccc
5、去除Chrome等浏览器文本框默认发光边框
6.去掉高光样式：
当然这样以来，当文本框载入焦点时，所有浏览器下的文本框的边框都不会有颜色上及样式上的变化了，这样的话，当文本框载入焦点时，边框颜色就会变为橙色，给用户一个反馈。
7、去除IE10+浏览器文本框后面的小叉叉，只需下面一句就ok了
input::-ms-clear {display: none}
8.H5页面写出来，在chrome中出现如下错误，只需添加如下css即可解决
*{touch-action: pan-y}
