应用象EM 和 REM这种相对长度单位进行页面排版是WEB开发中的最佳实践。在页面排版中较好应用EM 和 REM，根据设备尺寸缩放显示元素的大小。这就使得组件在不同设备上都达到最佳的显示效果成为可能。
但问题是究竟该用 EM 还是 REM 呢？关于这个问题一直存在比较大的争议。本文将会给大家介绍究竟什么是 EM 和 REM 和如何进行两者的选择，以及结合两者优势构建模块化的WEB组件。
注：本文内容简单，只面向初级开发人员，约2500字，阅读时间5分钟。
1 什么是EM？em 是相对长度单位。它相对于当前元素字体尺寸，即font-size。举例来说，如果当前元素的字体是20px，那么当前元素中的1em就等于20px。
h1 { font-size: 20px } /* 1em = 20px */ p { font-size: 16px } /* 1em = 16px */