rem佈局自適應效果很好，可以讓手機端pc端實現響應式佈局，總結如下：
首先我們看看rem是什麼？
rem和em單位一樣，都是一個相對單位。
區別在於：em是相對於元素的父元素的font-size進行計算；rem是相對於根元素html的font-size進行計算。
由此可見：rem不僅避免了複雜的層級關係，並且實現了類似於em單位的功能。
默認情況下瀏覽器給的字體大小是16px，因此按照轉化關係 16px = 1rem。
em 或 rem 單位進行相對佈局的時候，會比% 百分比的方式會更加靈活，而且可以支持瀏覽器的字體大小調整和縮放等的正常顯示。 又因爲em是相對於元素的父元素的font-size進行計算，所以開發中建議採用rem佈局單位。
那麼rem的自適應是如何處理呢？
在使用rem佈局的時候,爲了兼容不同的分辨率,我們應該動態的改變根字體的大小,讓所有的用rem單位的子元素跟着一起縮放,從而達到自適應的效果。
實現過程：
通常在項目的最前面加載一段js來修改html的font-size，針對不同分辨率計算font-size，監聽瀏覽器更改html的font-size。
var docEl=document.documentElement;
docEl.style.fontSize=20*(docEl.clientWidth/320)+‘px’;
給html設置fontSize大小，其實就是在DOMContentLoaded或者resize變化後調整fontSize的大小，從而調整rem的比值關係。
總結：
根據實際情況通過設計稿與當前可視區的大小做一個比例關係，通過這個比例進行縮放處理
rem自適應代碼實現：
效果如下：
第一個效果圖是全屏顯示狀態，第二個效果圖是我將瀏覽器窗口縮小後（很明顯，字體自動縮小了），第三個是手機端。