CSS单位 px pt em和rem 之间的区别
CSS中可以定义大小的单位有四种px，pt，em，rem，而px可以说在网页开发中最常见的单位了。不过现在如今的大多数网站已经开始用rem这个单位了。那么这四个单位有什么区别呢？
px|pt|em|rem区别
px单位
px（像素），国内网站相对来说用得比较多，任意浏览器的默认字体高都是16px。
pt单位
pt是point，是印刷行业常用单位，等于1/72英寸。
em单位
em才是真正的“相对单位”，它不是一个具体的数值，而是相对于父元素的属性计算出来的大小，一般移动终端布局用em比较合适。
rem单位
rem单位是CSS3中新增的一个相对单位，只不过它要比em单位强大一些，因为它是集相对大小和绝对大小的 优点于一身，也就是说它除了有px，pt 的绝对大小属性外，还具备了em的相对大小属性。为什么呢？因为rem这个单位是相对于根元素HTML的。而如果我们想修改大小，只需修改根元素HMTL 的大小就可以了。除了IE8及更早的版本个，目前所有的主流浏览器均支持此属性。
PX-EM-百分比-pt之间的对应关系
| Pixels | EMs | Percent | Points |
| 6px | 0.375em | 37.50% | 5pt |
| 7px | 0.438em | 43.80% | 5.5pt |
| 8px | 0.5em | 50% | 6pt |
| 9px | 0.563em | 56.30% | 7pt |
| 10px | 0.625em | 62.50% | 8pt |
| 11px | 0.688em | 68.80% | 8pt |
| 12px | 0.75em | 75% | 9pt |
| 13px | 0.813em | 81.30% | 10pt |
| 14px | 0.875em | 87.50% | 11pt |
| 15px | 0.938em | 93.80% | 11pt |
| 16px | 1em | 100% | 12pt |
| 17px | 1.063em | 106.30% | 13pt |
| 18px | 1.125em | 112.50% | 14pt |
| 19px | 1.188em | 118.80% | 14pt |
| 20px | 1.25em | 125% | 15pt |
| 21px | 1.313em | 131.30% | 16pt |
| 22px | 1.375em | 137.50% | 17pt |
| 23px | 1.438em | 143.80% | 17pt |
| 24px | 1.5em | 150% | 18pt |
转换公式：
pt=px乘以3/4
倍数em=倍数x16px
总结：每一个单位都有其存在的理由，只不过新出现的单位会更优，更方便。不管你在网站建设中用哪一个单位都没人 会说 你，只是新东西出来了，你不用，你就掉队了。在这里强烈推荐使用rem单位，不过也要注意属性的兼容性，IE8以下不支持rem，所以用rem好还是不用 rem好还得看你项目的目标用户，毕竟你的网站不是做给自己看的。
相关推荐
JKjiang 2020-07-30
葉無聞 2020-06-06
发条戏子 2020-05-30
hxmilyy 2020-05-11
csm0 2020-03-05
haolt00 2020-02-23
nicepainkiller 2020-01-01
Enjoyendless 2020-01-11
赵家小少爷 2019-12-25
87354091 2019-12-23
oKeYue 2019-11-20
zuncle 2019-11-18
csdnuuu 2019-11-05
tomli 2019-11-04
CaiKanXP 2019-11-02
绿豆饼 2019-10-20
qianxiaona 2014-06-29