rem

我理解的rem

查了不少資料。rem到底是什麼個單位。不少文章解釋他是由根元素html決定的。和其餘父元素無關

稀裏糊塗的寫一下個人理解。對與否請你們指教

瀏覽器默認的字體大小都是16px;因此1rem = 16px; 如何說計算簡便的話1rem = 10px是怎麼計算呢？ 16/100 = 10/x ，那麼x = 62.5%;

因此font-size:62.5%;這樣1rem = 10px;如此說來若是說定義邊距margin:20px; 的話。margin:20px/10px = 2rem;

若是真的用到項目中。確定要配合js這樣才完美

onresize();意思是屏幕改變就調用這個函數

 

window.onload = function(){

  var html = document.documentElement;

  var screen= html.clientWidth;

  function onload(){

   if(screen <= 320){

                 html.style.fontSize = '51.2px';   

            }else if(screen >= 640){

                  html.style.fontSize = '102.4px';  

            }else{

                  html.style.fontSize=0.16*screen+'px';  

            }

 

   }

 

onload()

window.onresize = function(){

onload()

}

}