通过断点来查看动态排版？

问题描述

我正在尝试了解以下文档：https://vuetifyjs.com/en/styles/text-and-typography/ 使用此vue模板代码段：

<div class="text-h4 text-xs-body-2">
  FooBar
</div>

我的想法是，这会将xs（移动）中的文本呈现为body-2的大小/样式。否则，它应该退回到h4。但是它不起作用，我不确定为什么吗？

解决方法

基数为xs。因此，在此示例中，h4是您的xs。它在文档中是这样说的：

这些类可以应用于从xs到xl的所有断点。使用基类.text- {value}时，它推断为.text-xs-$ {value}。

当省略断点即xs时，Vuetify中没有xs。