【CSS】px、em、rem的区别

1.px

px是绝对长度单位，相对于屏幕分辨率而言

2.em

em是相对长度单位，在设置文字高度或者与文字距离有关的时候，我们应该用em，毕竟浏览器的默认样式也推荐我们这么写

h1 {font-size: 2em; margin: .67em 0 }
h2 {font-size: 1.5em; margin: .75em 0 }
h3 {font-size: 1.17em; margin: .83em 0 }
p { margin: 1.12em 0 }

浏览器默认情况下 1em = 16px
在设置em的时候，其margin值也会随之改变，这是em的好处
缺点:它是会继承父级字体大小，问题是我们不知道它是继承哪个父级元素的字体大小

3.rem

rem是相对长度单位，它是相对于html根节点的字体大小设置的

注：谷歌浏览器最小的字体大小为12px