移动端布局rem

移动端布局和PC端布局相差很多，因为要考虑用户体验流畅等原因，移动端所用的样式越简洁越好，所需的样式也不多。这次就简单扯一扯如何移动端布局。

1、单位的选择

css单位有3种：

px：绝对单位

em：相对父元素的单位

rem：相对根元素（页面的html）的单位

在选择单位上，目前的常见单位有px，em，百分比，rem。前3种都比较常见，最后一种是CSS3的布局单位，它是基于整个页面设定的单位，em是相对于父元素本身，当字体本身发生变化，em就会发生变化，这样就会有许多问题。而rem是相对于整个页面的单位，即使内部再变化，rem的单位也是统一的。所以移动端布局我们选择的单位优先选择rem。

2、使用方法

我们用一下js，RT我们正常的页面是640的，除16后，rem的数值为40，我个人比较推荐40因为这个数值整数较多，而且也处于比较中间的位置，rem的数值相对于页面过小多大都会有影响，如果对基础不是很了解的可以看一下这位小伙伴的文章http://www.jianshu.com/p/b00cd3506782

引入后，我们就可以直接计算了，例如整个页面的宽度是640px我们转换后就是，16rem。

3、默认样式的清除

以上，只要我们涉及到曾经用px的部分我们就可以用rem来代替，同时百分比在这里面也是可以用的，剩下就靠耐心，毕竟遇到某些算数真的是要费脑子的。