移动项目的适配/vw/vh/px/rem/em/vmin/vmax区别

86 阅读1分钟

vw适配(新),配合postcss-pxtoviewport插件使用。

rem适配(旧),配合postcss-pxtorem 和 lib-flexible插件使用,

  • vw和vh: 相对于视口的大小,100vh等于视口的高度,100vw等于视口的宽度
  • px: 固定大小
  • em: 大小相对于父元素的font-size: 20px则1em = 20px
  • rem: 大小相对于html的font-size
  • vmin: 大小等于最小的视口: 100vmin等于最小的视口
  • vmax: 大小等于最大的视口