移动设备上的边距/填充 - Quasar Framework (VueJS)

bah*_*774 3 vue.js quasar vuejs2 quasar-framework

spacing当我希望它具有响应能力时如何使用。例如,我想设置 marging q-ma-md,但我希望仅当它是手机时才设置。那么如何做到这一点呢?

在此样式中,q-ma-mdmd 表示边距值,而不指定屏幕宽度。

jtl*_*sey 6

Quasar 目前提供类似于 bootstrap 和 tailwind 的功能。来自文档

启用后(通过 quasar.conf.js > Framework > cssAddon: true),它为所有与间距相关的 CSS 类提供断点感知版本。请注意,启用它后,CSS 占用空间将会明显增加。所以只有当你确实需要的时候才这样做。

用法:.q-(p|m)(t|r|b|l|a|x|y)-<bp>-(none|auto|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