CSS中大小单位px，em，rem以及微信小程序的rpx

CSS中可以定义大小的单位有四种px，em，rem 以及微信小程序的rpx 。

2017-05-25

---

1. px - 像素（Pixel）。相对长度单位。像素px是相对于屏幕分辨率而言的。
2. em - 相对长度单位。相对于当前对象内文本的字体尺寸。如当前对行内文本的字体尺寸未被人为设置，则相对于浏览器的默认字体尺寸。

• em的值并不是固定的；
• em会继承父级元素的字体大小；
• 任意浏览器的默认字体高都是16px。所有未经调整的浏览器都符合: 1em=16px。body选择器中声明Font-size=62.5%<==>1em=10px。

　　3.rem - 是CSS3的一个相对单位（root em，根em）,

• 使用rem为元素设定字体大小时，仍然是相对大小，但相对的只是HTML根元素。

　　4.rpx - 微信小程序中css的尺寸单位，rpx可以根据屏幕宽度进行自适应。规定屏幕宽为750rpx。

• 在 iPhone6 上，屏幕宽度为375px，共有750个物理像素，则750rpx = 375px = 750物理像素，1px = 2rpx。小程序设计稿可以使用设备宽度750px，比较容易计算。750px的话1rpx=1px