在自適應這塊，首先想到的就是rem這個相對於HTML根元素的單位。但是現在的問題是如何設置基准的fontSize可以避免麻煩切復雜的換算。理所當然的想到基基准的fontsize(即HTML的fontsize)為100px 的話，計算起來就會相對的簡單許多。思路沒問題，那么又如何根據一張特定的UI設計圖寫出可以自適應各種屏幕的頁面呢。
我們假如使用的設計圖是寬度為1920px,那么我們的基准fontsize應該怎么根據屏幕的大小定呢。這個基准fonzise肯定不是一個定值，因為屏幕大小不一致啊。在此，我們就需要根據屏幕的大小來動態設置基准的fontsize了。
先看這樣一段代碼：
var remWindowWidth=19.2
document.getElementsByTagName('html')[0].style.fontSize=document.documentElement.clientWidth/remWindowWidth+'px';
window.onresize = function(){
document.getElementsByTagName('html')[0].style.fontSize=document.documentElement.clientWidth/remWindowWidth+'px';
}
有沒有看懂？這不就是動態設置基准的fontsize么？但是為什么要除以19.2呢？因為我們參考的UI設計圖是1920px的呀，要是UI設計圖是1360px,那么就會是屏幕的寬度除以13.6.即remWindowWidth = UI設計圖的寬度/100,這樣的話基准的fontzise在與設計圖相同分辨率的情況下就是100px了。至於在別的情況下是不是100px,我們就不用管那么多了，因為在不同分辨率下的基准是不一樣的，我們只需要根據設計圖走就好了。別的分辨率情況下會自動轉化的。
還有，這個動態設置基准的方法一定要寫在文檔的最上面哦，要不然都沒有基准，怎么顯示rem的計算值呀