关于rem单位

1、rem是什么?

rem(font size of the root element)是指相对于根元素的字体大小的单位

2、为什么web app要使用rem?

实现强大的屏幕适配布局(淘宝,腾讯,网易等移动端网站都是rem布局适配),rem能等比例适配所有屏幕,根据变化html的字体大小来控制rem单位值换算到像素单位值的大小,如不同html字体大小的计算下,rem值不同:

/*第一个例子:*/
html{font-size:10px;}
a{width:1rem;height:1rem}
10px = 1rem * 10px

/*第二个例子:*/
html{font-size:20px;}
a{width:1rem;height:1rem}
20px = 1rem * 20px

/*推算出:*/
10px  = 1rem 在根元素(font-size = 10px的时候);
20px  = 1rem 在根元素(font-size = 20px的时候);
40px  = 1rem 在根元素(font-size = 40px的时候);

3、如何统一处理分辨率,虚拟宽度等问题?

例如淘宝手机客户端采用flexible.min.js动态计算每个客户端的html应该设置多少字号,然后统一处理,包括监听屏幕变换等情况。miniMobile是基于稍加修改后的flexible.min.js来实现栅格化,实现设计稿的像素值一一对应到前端项目中的rem值。
注意miniMobile中: 1rem值 = 100px设计稿件值