remrem是CSS3新增的一个相对单位（rootem，根em），相对于根元素(即html元素)font-size计算值的倍数只相对于根元素的大小rem（fontsizeoftherootelement）是指相对于根元素的字体大小的单位。简单的说它就是一个相对单位。作用：利用rem可以实现简单的响应式布局，可以利用html元素中字体的大小与屏幕间的比值设置font-size的值实现当屏幕分辨率变化时让元素也变化，以前的天猫tmall就使用这种办法em文本相对长度单位。相对于当前对象内文本的字体尺寸。如当前对行内文本的字体尺寸未被人为设置，则相对于浏览器的默认字体尺寸(默认16px)。(相对父元素的字体大小倍数)em（fontsizeoftheelement）是指相对于父元素的字体大小的单位。它与rem之间其实很相似，区别在。（相对是的HTML元素的字体大，默认16px）em与rem的重要区别：它们计算的规则一个是依赖父元素另一个是依赖根元素计算

(function(win,lib){vardoc=win.document;vardocEl=doc.documentElement;vardevicePixelRatio=win.devicePixelRatio;vardpr=1;varscale=1;//设置vierPortfunctionsetViewport(){dpr=1;win.devicePixelRatioValue=dpr;scale=1/dpr;varmetaEl=doc.createElement('meta');metaEl.setAttribute('name','viewport');metaEl.setAttribute('content','initial-scale='+scale+',maximum-scale='+scale+',minimum-scale='+scale+',user-scalable=no');if(docEl.firstElementChild){docEl.firstElementChild.appendChild(metaEl);}else{varwrap=doc.createElement('div');wrap.appendChild(metaEl);doc.write(wrap.innerHTML);}}setViewport();varnewBase=100;//把页面划分为100等分//设置RemfunctionsetRem(){varvisualView=Math.min(docEl.getBoundingClientRect().width,lib.maxWidth);newBase=(100*visualView)/lib.desinWidth;docEl.style.fontSize=newBase+'px';}vartid;lib.desinWidth=640;lib.baseFont=18;lib.maxWidth=540;lib.init=function(){win.addEventListener('resize',function(){clearTimeout(tid);tid=setTimeout(setRem,300);},false);win.addEventListener('pageshow',function(e){if(e.persisted){clearTimeout(tid);tid=setTimeout(setRem,300);}},false);if(doc.readyState==='complete'){doc.body.style.fontSize=lib.baseFont*dpr+'px';}else{doc.addEventListener('DOMContentLoaded',function(e){doc.body.style.fontSize=lib.baseFont*dpr+'px';},false);}setRem();docEl.setAttribute('data-dpr',dpr);};})(window,window['adaptive']||(window['adaptive']={}));window['adaptive'].desinWidth=750;window['adaptive'].baseFont=12;window['adaptive'].maxWidth=540;window['adaptive'].init();以上代码以设计稿750px的为标准,如果是非750px,在实际页面中,将它转化为750,然后再做转化,根据rem,将一个页面平均分成多少个等分,做移动端适配。将这段js代码命名为一个mobile-adaption.js引入到页面中,就可以愉快的使用了,将px转化为rem,实现自适应布局。在不同的设备当中保持一致。每个公司都有自己的一套标准,有的也用手淘那一方案.遵循自己公司开发规范即可。

html{font-size:16px}div{font-size:1rem}这里的rem就是16px;给html{font-size:26.66667vw;};//26.66667vw=100px/375px*100vw，这是iPhone5下的值，如果是其他更大尺寸的手机，26.66667vw的实际像素数要大于100px.div{font-size:0.16rem};//以100px作为rem，根据UI的px计算更方便