移动端rem 与 em的理解

1、移动端如果使用rem是怎么换算px单位的：

　　　转化为px的大小取决于页根元素的字体大小，即 html 元素的字体大小。 根元素字体大小乘以你 rem 值。
　　　例如，根元素的字体大小 16px，设置width为10rem 实际上的像素值就为160px，即 10 x 16 = 160。

优点：1、自适应效果好；
　　　2、兼容性好，除了IE8及更早版本外，所有浏览器均已支持rem。

缺点：1、Android 浏览器下 line-height 垂直居中偏离的问题。
　　　　 常用的垂直居中方式就是使用line-height，这种方法在Android设备下并不能完全居中。
　　　2、存在小数像素问题，浏览器渲染最小的单位是像素，元素根据屏幕宽度自适应，通过 rem 计算后可能会出现小数像素，
　　　   浏览器会对这部分小数四舍五入，按照整数渲染。浏览器在渲染时所做的摄入处理只是应用在元素的尺寸渲染上，
　　　　 其真实占据的空间依旧是原始大小。也就是说如果一个元素尺寸是 0.625px，那么其渲染尺寸应该是 1px，
 　　　　空出的 0.375px 空间由其临近的元素填充；同样道理，如果一个元素尺寸是 0.375px，其渲染尺寸就应该是0，
　　　　 但是其会占据临近元素 0.375px的空间。会导致：缩放到低于1px的元素时隐时现
　　　　（解决办法：指定最小转换像素，对于比较小的像素，不转换为 rem 或 vw）；

2、移动端如果使用em是怎么换算px单位的：

　　　em转化为px，大小取决于自身父级元素所设置的px值。父级元素字体大小乘以em值。
　　　例如，父级元素字体大小为13px,10em将等同于130px,即13x10 = 130px。
注意：任意浏览器的默认字体高都是16px。
　　　所有未经调整的浏览器都符合: 1em=16px。那么12px=0.75em,10px=0.625em。
　　　为了简化font-size的换算，需要在css中的body选择器中声明Font-size=62.5%，这就使em值变为 16px*62.5%=10px, 
　　　这样12px=1.2em, 10px=1em, 也就是说只需要将你的原来的px数值除以10，然后换上em作为单位就行了。