前言在自适应布局或者移动web开发中，我们经常会用到em和rem这两个长度单位。接下来我们来讨论一下这两个单位和px的区别，以及它们的使用场景等，区别就是pxpx，一个像素（电脑屏幕上的一个点）。（引用自w3school-cssunit）像素（Pixels），相对长度单位，它是相对于显示器的屏幕分辨率的，兼容且准确，但是这种方法是在用户缩放浏览器时或者需要与不同的设备兼容我们的页面布局在移动设备时可能会被破坏。Emem就是为了解决上述问题而进化而来的。它也是一个相对长度单位，根据使用它的元素的大小来确定（有些人误认为它是基于父元素的，因为使用它的元素继承了父类的属性。根据W3Cstandard,它们基于当前对象元素的字体大小），可以自动适应用户使用的字体。em，相对长度单位。相对于当前对象中文本的字体大小。如果内联文本的当前字体大小没有手动设置，则它是相对于浏览器的默认字体大小。（引用自em-CSS3参考手册）em值的计算假设任何浏览器的默认字体大小都是16px。1em=16px在所有未调整的浏览器中。为了方便转换，我们通常会在css中设置body属性font-size:62.5%，让1em值变成10px，这样我们就可以将设计稿的px值除以10，然后替换成以em为单位px和em的换算非常简单。例如16px可以改写为1.6em。由于rem的em值不固定，不同元素下1em的值会根据元素的大小或元素的父元素的不同而不同，所以当我们多次使用时，会带来开发上的困难。这时候rem(rootem)就应运而生了。rem是相对于根（html）元素而言的，也就是说我们只需要根据自己的需要为根元素确定一个参考值，然后通过只修改根元素就可以用它来按比例调整所有的字体大小。也可以避免字号逐层复合的连锁反应。最大的优点是它提供了一致的尺寸，便于计算。rem，相对长度单位。相对于根元素（即html元素）的字体大小计算值的倍数。（引用自rem-CSS3参考手册）根元素重写了em和rem单位的区别，这是根据浏览器将谁转换成px值。em是根据当前对象中文本的字体大小来确定的，rem是根据html元素来确定的。根（html）元素的字体大小由字体大小决定，如果根（html）元素的字体大小没有明确设置为固定值来覆盖，那么它首先来自于浏览器设置，所以浏览器的字体大小设置会影响每个使用rem单位和每个通过em单位继承的值。为了还原设计稿，实现合理布局，需要重写根元素。浏览器缩放动态修改根元素的大小，可以参考下面的代码片段。同时，也有人认为这种做法在一定程度上剥夺了用户设置浏览器字体的权利。他们的观点是，rem的好处是给我们提供了一种获取用户偏好的方式来影响网站中使用rem的每一个元素的大小。无论用户如何设置浏览器，我们的布局都可以调整到合适的大小。这个先不说了，以后有机会再说吧。用例如果此属性是根据其字体大小测量的，则使用em，否则在媒体查询中使用rem。Units在多列布局中不使用em或rem——使用%aboutem和rem来完成模块化组件中的应用实例可以参考这篇文章。兼容所有浏览器都支持px，除了IE8及以下，其他浏览器都支持em和rem属性。对于不支持的浏览器，额外写一个绝对单元语句。IE9/IE10不支持rem用于伪元素或字体缩写。IOSSafari5.0-5.1支持rem，但在使用媒体查询时不支持rem。这里有一个px,em,rem单位转换给大家的工具。地址：http://pxtoem.com/discussionareacsdn移动端和pc端两套代码，两种字体大小声明，pc端使用px，不自适应根据浏览器缩放，移动端使用rem，根据屏幕width重写根元素，实现自适应。掘金首页使用了rem，根元素在chromeformac中固定为12px，但是文字大小是根据浏览器缩放自适应的。你的团队是怎么做到的？
