1.px与em
==px==: 方便但是在浏览器中放大或是缩小页面，或是改变浏览器字体大小时，页面的布局会被打乱。
==em==: 可以解决px的问题，但是在进行任何元素设置时，需要知道其父类的大小，很容易出错，且不方便。
两者换算方法： 一般都是以的“font-size”为基准,浏览器默认大小为16px.
body{
font-size:62.5%; //10 ÷ 16 × 100% = 62.5%
}
h1{
font-size:2.4em;//2.4em × 10 = 24px
}
p{
font-size:1.4em;//1.4em × 10 = 14px
}
li{
font-size:1.4em;//1.4em × 10 = ??
/*因为不知其父类元素的大小，值可能是1.4或是20px，值是不确定的*/
}
2.px与rem
==rem==： 可以解决em的问题，但是IE6~IE8的浏览器是无法兼容的
两者换算方法:rem是以< html >的“font-size”作为基准
html{
font-size:62.5%; //10 ÷ 16 × 100% = 62.5%
}
body{
font-size:1.4rem;//1.4em × 10 = 14px
}
p{
font-size:2.4rem;//2.4em × 10 = 24px
}
解决兼容性的办法：在IE6~IE8浏览器中使用px，其他浏览器中使用rem
