【一系列重要的meta標簽聲明】
<meta name="viewport" content="width=device-width;initial-scale=1.0;maximum-scale=1.0;user-scalable=0">
<meta name="app-mobile-web-app-capable" content="yes">
<meta name="format-detection" content="telephone=no">
<meta http-equiv="pragma" content="no-cache">
【去除表單默認外觀】
-webkit-appearance:none;
【去除a鏈接、表單按鈕的默認透明藍色遮罩背景】
-webkit-tap-highlight-color: rgba(0,0,0,0)；
【修改placeholder屬性的文本顏色】
-webkit-input-placeholder：color:‘自己所需’；
【解決3D動畫顯示閃爍的問題】
-webkit-backface-visibility：hidden
【激活iphone中的active偽類效果，給a和button標簽綁定】
var aA=document.getElementsByTagName('a');
for( var i=0; i<aA.length; i++ ){
? ? aA[i].addEventListener( 'touchstart',function(){},false );
}?
var aBtn=document.getElementsByTagName('button');
for( var i=0; i<aBtn.length; i++)
? ?aBtn[i].addEventListener( 'touchstart',function(){},false );
}
【解決iphone的快速流暢滑動效果，可以放在body里面，任何用到滑動的地方都可以用到，設置固定高度加上overflow-y:auto，模擬iscroll的滑動效果】
-webkit-overflow-scrolling : touch;
【禁止用戶選中文字】
-webkit-user-select:none;
【打電話、發信息和發郵件】
<a href="tel:13650960577">撥打電話</a>
<a href="sms:10086">發送信息</a>
<a href="mailto:1648238539@qq.com">發送郵件</a>
【阻止旋轉屏幕時自動調整字體大小】
html,body,form,p,div,h1,h2,h3,h4{ -webkit-text-size-justify:none }
【屏幕旋轉onorientationchange事件和檢測】
<script>
? ? ? ?addEventListener( 'load',function(){
? ? ? ? ? ?onorientationChange();
? ? ? ? ? ? window.onorientationchange=orientationChange;
? ? ?});
? ? function orientationChange(){ ? ? ?//判斷屏幕是否旋轉
? ? ? ? ? ? swith( window.orientation ){
? ? ? ? ? ? ? ? case 0:
? ? ? ? ? ? ? ? ? ? alert('正面')；
? ? ? ? ? ? ? ? ? ? ?break;
? ? ? ? ? ? ? ? case 90:
? ? ? ? ? ? ? ? ? ? ?alert('向右旋轉90度');
? ? ? ? ? ? ? ? ? ? ? break;
? ? ? ? ? ? ? ? ?case -90:
? ? ? ? ? ? ? ? ? ? ? ?alert('向左旋轉負90度');
? ? ? ? ? ? ? ? ? ? ? ?break;
? ? ? ? ? ? ? ? ?case 180:
? ? ? ? ? ? ? ? ? ? ? ?alert('風景模式');
? ? ? ? ? ? ? ? ? ? ? ? break; ??
? ? ? ? ? ?}
? ? }?
</script>
