1、禁止IOS，Android長按下載圖片

.css { -webkit-touch-callout : none; }

2、禁止IOS，Android使用者選中文字

 .css { -webkit-user-select : none;  }

3、① IOS中input [ type =’button’] 顯示的不是自己設定的樣式，而是IOS預設樣式；② 移動端IOS手機下清除輸入框內陰影

input [ type='button'] { -webkit-appearance : none ; }

4，input獲取焦點時，禁止鍵盤彈出

 $('input'
 
).on('focus',function(){
    document.activeElement.blur();
 })

5，IOS或者說IPhone中，滑動不流暢 || 卡頓現象解決：

 .css { -webkit-overflow-scrolling : touch; }

6，

 input,textarea {
   -webkit-appearance: none;
}

7，webkit表單輸入框placeholder的顏色值改變

input::-webkit-input-placeholder{color:red;} //如果想要預設的顏色顯示紅色
 


input:focus::-webkit-input-placeholder{color:blue;} //如果想要使用者點選變為藍色

8，IOS.android系統中，點選數字撥打電話

<a href="tel:4008006666">打電話給:4008006666</a>

9，a,button,input,optgroup,select,textarea 等標籤點選的時候背景變暗

element {
    -webkit-tap-highlight-color: rgba(0,0,0,0);//transparent
}

10，設定狀態列的背景顏色（IOS）

設定狀態列的背景顏色，只有在 “apple-mobile-web-app-capable” content=”yes” 時生效

<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" /> 

content 引數； default ：狀態列背景是白色。black ：狀態列背景是黑色。
black-translucent ：狀態列背景是半透明。 如果設定為 default 或 black ,網頁內容從狀態列底部開始。 如果設定為 black-translucent ,網頁內容充滿整個螢幕，頂部會被狀態列遮擋。

11，手機拍照和上傳圖片

<input type="file">的accept 屬性

<!-- 選擇照片 -->
<input type=file accept="image/*">

<!-- 選擇視訊 -->
<input type=file accept="video/*">

使用總結：

• ios 有拍照、錄影、選取本地圖片功能
• 部分android只有選取本地圖片功能
• winphone不支援
• input控制元件預設外觀醜陋

12，消除transition閃屏

.css{

    -webkit-transform-style: preserve-3d;

    -webkit-backface-visibility: hidden;
}

開啟硬體加速
解決頁面閃白
保證動畫流暢

.css {
   -webkit-transform: translate3d(0, 0, 0);
   -moz-transform: translate3d(0, 0, 0);
   -ms-transform: translate3d(0, 0, 0);
   transform: translate3d(0, 0, 0);
}

設計高效能CSS3動畫的幾個要素
儘可能地使用合成屬性transform和opacity來設計CSS3動畫，
不使用position的left和top來定位
利用translate3D開啟GPU加速

暫時遇到這些小問題，但是很有可能遇到的，隨著開發再更新。