兩者區別

              em會繼承父級元素的字型大小。

             em是相對長度單位。相對於當前物件內文字的字型尺寸。如當前對行內文字的字型尺寸未被人為設定，則相對於瀏覽器的預設字型尺寸。

              使用rem為元素設定字型大小時，仍然是相對大小，但相對的只是HTML根元素

rem單位的使用       

（直接引入下面的js程式碼就可實現自適應字型）

   如果我們需要的是實現字型自適應，不需要手動重新整理，就需要js去封裝  rem 單位。

       var fun=function(doc,win){
          var docEl=doc.documentElement,
              resizeEvt='orientationchange'    in window ? 'orientationchange' : 'resize',
              recalc=function(){
                  var clientWidth =docEl.clientWidth;  //clientWidth視窗大小
                  if(!clientWidth) return;
                  if((12 * (clientWidth / 640)) <= 20) { 

                           //此處  640 為螢幕寬度，

                          //  12 * (clientWidth / 640) ;  表示 12px =1rem
                             docEl.style.fontSize = 12 * (clientWidth / 640) + 'px';
                      }else{
                            docEl.style.fontSize = 10 +'px';
                      }
              } 
            if(!doc.addEventListener) return;
            win.addEventListener(resizeEvt,recalc,false);
            doc.addEventListener('DOMContentLoaded',recalc,false);  
        }
        fun(document,window);