px,vw/vh,rem的区别

• em/px/rem/vh/vw 都属于 css 的单位,这些单位可以分为相对单位、绝对单位
• px:绝对单位,网页按照精确像素来显示.
• em:相对单位,相对自身定义的 font-size 来计算,自身没有设置字体大小,相对父元素的字体大小
• rem:相对单位,相对根元素 html 的字体大小来计算
• vw/vh:相对视口大小布局,把屏幕平均划分为 100 等份

px

是绝对单位

rem

rem，相对单位，相对的只是 HTML 根元素font-size的值

vh、vw

视口的宽高

 三、总结

px：绝对单位，页面按精确像素展示

em：相对单位，基准点为父节点字体的大小，如果自身定义了font-size按自身来计算，整个页面内1em不是一个固定的值

rem：相对单位，可理解为root em, 相对根节点html的字体大小来计算

vh、vw：主要用于页面视口大小布局，在页面布局上更加方便简单