記IOS兼容性問題

1.iphonex等手機上要想設置頁面可滾動，必須給最外層的盒子一個初始的高度，並且要設置-webkit-overflow-scrolling屬性，例如
 

.wraper{
    height:100px;
    -webkit-overflow-scrolling: touch;
}

注意這裏有一個坑，高度不能用min-height設置，否則會導致頁面不能滾動

2.ios上設置padding-bottom屬性來撐開高度是沒有用的，可以放一個跟padding-bottom等高的盒子來佔位

3.去掉ios橫向滑動和豎向滑動的滾動條的方法
直接用css去隱藏ios的滾動條是沒用的，只能採用溢出隱藏的方式去把滾動條隱藏條，例如隱藏右側的滾動條，需要兩個盒子，分別給父元素和子元素設置如下屬性

.father{
    overflow: hidden;
}

.child {
    overflow-x: hidden;
    overflow-y: auto;
    width: 102%;
    height: 100%;
    box-sizing: border-box;
    padding-right: 8px;
}

4.ios設置position:absolute和position:fixed定位，必須同時設置top和left屬性纔行，否則定位會亂

5.ios上儘量不要設置浮動佈局，容易產生兼容性6.ios使用浮動佈局的時候，因爲z-index的層級問題也會產生奇怪的bug，遇到問題的時候可以往這方面思考
6.遇到有兼容性問題的插件，不要着急，多找找他的使用方法和看看源碼，一般比較成熟的插件都會考慮到兼容性問題，出現問題多半是你不會用