字体尺寸参考表
| PX |
REM |
| 4px |
0.25rem |
| 8px |
0.5rem |
| 12px |
0.75rem |
| 16px |
1rem |
| 20px |
1.25rem |
| 24px |
1.5rem |
| 32px |
2rem |
| 40px |
2.5rem |
| 48px |
3rem |
| 64px |
4rem |
| 96px |
6rem |
| 128px |
8rem |
| 160px |
10rem |
| 176px |
11rem |
| 192px |
12rem |
| 208px |
13rem |
| 224px |
14rem |
| 256px |
16rem |
| 320px |
20rem |
| 480px |
30rem |
| 576px |
36rem |
| 768px |
48rem |
| 800px |
50rem |
| 960px |
60rem |
| 992px |
62rem |
| 1024px |
64rem |
| 1120px |
70rem |
| 1200px |
75rem |
| 1280px |
80rem |
| 1440px |
90rem |
| 1600px |
100rem |
在线CSS单位PX转换REM工具
-
设置了网页默认的字体像素 (通常 16px),输入像素值，可以将 px 换算为 em。输入em（相对长度单位）值，可以将 em 换算为 px。
-
PX：px像素（Pixel）。相对长度单位。像素px是相对于显示器屏幕分辨率而言的。
-
EM：em是相对长度单位。相对于当前对象内文本的字体尺寸。如当前对行内文本的字体尺寸未被人为设置，则相对于浏览器的默认字体尺寸。
-
REM：使用rem为元素设定字体大小时，仍然是相对大小，但相对的只是HTML根元素。
px 与 rem 如何选择
-
对于只需要适配少部分手机设备，且分辨率对页面影响不大的，使用px即可 。
-
对于需要适配各种移动设备，使用rem，例如只需要适配iPhone和iPad等分辨率差别比较挺大的设备。