前端项目使用vw视口单位进行适配时字体大小的解决方案

使用视口单位vw来实现响应式排版。1vw等同于视口宽度的百分之一，即如果你用vw来设定字体大小的话，字体的大小将总是随视口的大小进行改变。

问题在于，当做上面的事情的时候，因为文本总是随着视口的大小改变大小，用户失去了放缩任何使用vw单位的文本的能力。所以你永远都不要只用 viewport 单位设定文本。

例如我们使用postcss-px-to-viewport对vw进行转换，转换后的字体单位也是vw,当浏览器进行缩放时，字体会随之变大或变小

这里有一个解决方法，它使用了calc()，如果你将vw单位加到了使用固定大小（例如em或者rem）的值组，那么文本仍然是可放缩的。基本来说，是vw加在了放缩后的值上。

h1 {
  font-size: calc(1.5rem + 3vw);
}

然后再配合媒介查询中重新定义fontSize