關於移動端適配的問題，之前一直是懵的，網上有很多文件，找了幾篇看後發現方式方法有很多，基本不同，但是普遍選擇rem來代替px做單位。
這是因為：
rem本身沒有繼承性。
接下來就對整個過程進行詳解！
我們知道，rem是以html的font-size大小為基準進行計算的，比如html的font-size為10px，那麼1rem就等於10px。
下面用一張實際的標註圖進行解析
該圖是設計給的750的圖，圖中的各種標註，都是以750為基準的。
（這裡我們以適配iphone6為例，iphone6解析度為375）
首先主要看「**」的容器寬，設計圖所標註**容器寬在解析度為750的情況時，寬為320px。那麼可以得知如果適配分辨為375的iphone6時，他的容器寬應該為180px。
以上都是我們已知的。
這時候如果我們html的font-size為10px，那麼我們**容器寬設定為18rem即可。（接下來就實現動態設定html的font-size）
具體實現方法看如下，首先我們看動態計算html的font-size的**：
(function (win, doc)
//呼叫函式
change();
//視窗發生改變時,新增繫結事件
經由上圖計算，可以得知，當我們裝置寬為375（iphone6）時，頁面html的font-size值為10px，此時1rem就等於10px。
根據750的設計圖得知容器寬此時為320，那麼適配375時，容器寬應為180。這時經由上圖**計算得知，適配裝置解析度為375時，他html的font-size值為10px，那麼此時將容器設定為18rem，就可以做到對iphone6下的適配。
（疑問：設計圖標註為320，手動計算設定為18，有沒有什麼辦法直接根據設計圖給的尺寸輸入就可實現計算呢）
當然有！！！
這個時候就顯示出scss的強大了，我們通過scss定義乙個計算方法（如下圖）：
$basefontsize: 20px !default;
@function pxtorem($px)
將設計圖中容器寬320px套用到公式中，經過計算，可以得到值為18rem。這樣，在iphone6下，就可以得到適配過後的容器寬了。
（以上只對iphone6進行解釋，其他裝置經測試，適配效果很好）
關於rem適配移動端
function doc,win if doc.addeventlistener return win.addeventlistener resizeevt,recalc,false doc.addeventlistener domcontentloaded recalc,false documen...
關於移動端適配問題
移動端適配採用rem進行編寫css，整理了三種方案 方案一 簡單的js適配 function resizeroot width document.documentelement.style.fontsize devicewidth num1 px resizeroot 750 window.onre...
移動端適配
js適配方案 function resizefun else body removeclass hightscreen shortscreen portrait var ratio window width window height if screenstate portrait else if ...