Vue.js 移动类星体框架（VueJS）上的边距/填充

如何使用

间距

使其具有响应性。 例如，我想设置marging

q-ma-md

，但我只希望它是移动电话。那么如何做到这一点呢

---

在这种样式中，

q-ma-md

md表示边距值，不指定屏幕宽度

在安装的功能中，使用

if(this.$q.platform.is.mobile){
this.class_variable='q-ma-md'
}
else{
this.class_variable=''
}

然后把它绑在你的前端

<div :class='class_variable'></div>

---

类星体目前有类似于引导和顺风的功能。从

启用时（通过quasar.conf.js>framework>cssAddon:true），它为所有与间距相关的CSS类提供断点感知版本。 请注意，启用CSS时，它的占用空间会有明显的起伏。所以只有在你真正需要的时候才去做

用法：

q-（p|m）（t|r|b|l|a|x|y）-（无自动xs|sm|md|lg|xl）

示例：

q-pa-xs-md q-pa-sm-sm q-px-md-lg q-py-md-md q-ma-md-sm

---

你查过了吗？这份官方文件说，

md

实际上与屏幕宽度有关。我确实这样做了。据我所知，这个参数指定了值（位边距是多少）请看一下这个屏幕截图，如果你真的需要不同屏幕大小的不同边距，你可以用内容复制你的容器。一个容器有小的边距，一个容器有大的边距。然后根据网格系统的屏幕大小显示或隐藏整个容器。这是一种多余的黑客行为。鉴于bootstrap有这样的特性，我认为类星体也有同样的特性，或者有点类似。添加样式要容易得多。但我打赌类星体框架中也存在类似的smth。只需要找到它也许这适合你的需要？