less变量如何随屏幕宽度变化?

不管是 Less 还是 Scss 或者 Stylus，他们的变量都在被编译成CSS的时候就消失了。变成一个固定的CSS属性值。这些CSS预处理器并不会在客户端运行，所以也就是我们为什么会把他们放到 开发依赖 当中。

如果你想要在浏览器环境按照不同业务场景去变更的话，可以使用 CSS 变量。只要你提前定义好上就可以去随时修改和使用它（JS来控制需要放在 body 的行内样式中）。

例如说你的需求

:root{
  --xw: 10vw;
}
@media (min-width: 1000px){
  body{
      --xw: 20px;
  }
}
.test{
  font-size: var(--xw)
}