1.由於本人使用的是sublime.text，使用rem就可以達到效果。
點擊菜單中的preferences下的browse packages，選擇cssrem-master，添加或者編寫cssrem.sublime-settings文件。
設置px_to_rem的值為75即可。
在代碼里輸入設置的對應px值，按TAB鍵就可以轉換為rem
在使用時，同事引用flexible.js文件
2.<meta name="apple-mobile-web-app-capable" content="yes">
下面（）里的不用
（使用meta標簽，這也是普遍使用的方法，理論上講使用這個標簽是可以適應所有尺寸的屏幕的，但是各設備對該標簽的解釋方式及支持程度不同造成了不能兼容所有瀏覽器或系統。
首先解釋該標簽的含義：<meta name="viewport" content="width=device-width,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
如果你完全不了解這個標簽的使用需要先百度一下。
解釋：content中的“width” 這個width指的是什么寬度，我看過的文章對這個都沒有解釋的很清楚，有幾個備選：虛擬窗口的寬度、手機屏幕的寬度、還是頁面的寬度等等？經試驗這個指的是虛擬窗口的寬度。了解寬度之后，對后續的各種scale，就應該知道是誰與誰的比例，是 虛擬窗口寬度 / 頁面寬度，這樣就會有問題出現安卓設備尺寸差異很大光主流的就有寬度為 320 480 720 1080 等各種尺寸而以上標簽只能支持一種尺寸，當然有些瀏覽器會自動縮放使其適應屏幕，但這不是統一標准，正確的做法是用js動態生成此標簽，當然，應該先獲取屏幕尺寸。）
<script type="text/javascript">
if(/Android (\d+\.\d+)/.test(navigator.userAgent)){
var version = parseFloat(RegExp.$1);
if(version>2.3){
var phoneScale = parseInt(window.screen.width)/640;
document.write('<meta name="viewport" content="width=640, minimum-scale = '+ phoneScale +', maximum-scale = '+ phoneScale +', target-densitydpi=device-dpi">');
}else{
document.write('<meta name="viewport" content="width=640, target-densitydpi=device-dpi">');
}
}else{
document.write('<meta name="viewport" content="width=640, user-scalable=no, target-densitydpi=device-dpi">');
}
</script>
3.微信分享要引用的<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
4.使用媒體查詢功能 比如兼容iphone的樣式 @media only screen and (min-device-width : 320px) and (max-device-height : 460px){}
做到以上幾點，基本的自適應就可以了