rem em px vm/vh

px:

px是绝对单位，rem和em是相对单位

 

em:

em是相对于自身元素的字体大小单位，特例font-size相对父元素

em缺点：页面里面的嵌套父元素太多，不好统一控制

rem:

rem是相对于html元素的字体大小单位，如html设置font-size=12px，其他元素设置width：2rem，换成px就是24px rem

优点：可以通过一个html的字体大小，来改变整体页面中元素的尺寸大小，进而可以达到页面缩放的效果。

 

vm/vh

 

vw/vh是一个相对单位

vw：viewpoint width视口宽度 vh：viewpoint height视口高度

相对视口尺寸计算公式： 1vw = 1/100视口宽度 1vh = 1/100视口高度

比如：当前屏幕视口宽度375px，1vw=3.75px

与百分比区别：它相对当前视口屏幕来说，百分比是相对于父元素