PX、EM、REM单元换算表参考
CSS中咱们经常利用的单元是px与em，CSS3又给咱们带来了新单元rem，那末px、em、rem的三者有甚么区分，又各自有甚么好坏呢？
| PX单元的特色
1. IE没法调剂那些利用px作为单元的字体巨细；
2. 外洋的大局部网站能够或许调剂的缘由在于其利用了em或rem作为字体单元；
3. Firefox能够或许调剂px和em，rem，可是96%以上的中国网民利用IE阅读器(或内核)。
px像素（Pixel）。相对长度单元。像素px是相对显现器屏幕分辩率而言的。(引自CSS2.0手册)
em是相对长度单元。相对以后工具内文本的字体尺寸。如以后对行内文本的字体尺寸未被报酬设置，则相对阅读器的默许字体尺寸。(引自CSS2.0手册)
肆意阅读器的默许字体高都是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作为单元就好了。
| EM单元的特色
1. em的值并不是牢固的；
2. em会担当父级元素的字体巨细
以是咱们在写CSS的时辰，须要注重两点
1. body挑选器中申明Font-size=62.5%；
2. 将你的本来的px数值除以10，而后换上em作为单元；
3. 从头计较那些被缩小的字体的em数值。防止字体巨细的反复申明。
也便是防止1.2 * 1.2= 1.44的景象。比方说你在#content中申明了字体巨细为1.2em，那末在申明p的字体巨细时就只能是1em，而不是1.2em, 由于此em非彼em，它因担当#content的字体高而变为了1em=12px。
| rem单元的特色rem
是CSS3新增的一个相对单元（root em，根em），这个单元引发了普遍存眷。这个单元与em有甚么区分呢？区分在于利用rem为元素设定字体巨细时，依然是相对巨细，但相对的只是HTML 根元素。这个单元堪称集相对巨细和相对巨细的长处于一身，经由过程它既能够做到只点窜根元素就成比例地调剂一切字体巨细，又能够防止字体巨细逐层复合的连锁反映。今朝，除IE8及更早版本外，一切阅读器均已撑持rem。
挑选利用甚么字体单元首要由你的名目来决议，若是你的用户群都利用最新版的阅读器，那保举利用rem，若是要斟酌兼容性，那就利用px,或二者同时利用。
