【问题标题】:How to change justify depending on the size of the screen in Vuetify?如何根据 Vuetify 中的屏幕大小更改对齐方式?
【发布时间】:2021-10-05 04:39:30
【问题描述】:

在我的应用程序中,我使用justify="end" 的结束对齐按钮。如果屏幕较小(例如平板电脑),我想将其更改为居中对齐 - justify="center"

我的代码:

<template>
  <v-row  justify="end" >
    <v-col cols="5">
      <v-btn
        to="/"
        >Back</v-btn
      >
    </v-col>
  </v-row>
</template>

我也尝试过使用类似这样的 css 样式,但它不起作用:

<style scoped>
@media (max-width: 800px) {
  .justify{
    justify: center;
  }
}
</style>

【问题讨论】:

    标签: css vue.js vuetify.js justify


    【解决方案1】:

    您可以在 vuetify 中使用内置的 flex 类来代替 props,例如 .justify-md-center

    查看 vuetify 文档中的此链接:

    vuetify flex classes documentation

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2020-02-01
      • 1970-01-01
      • 1970-01-01
      • 2023-03-11
      • 2021-07-13
      • 2020-09-04
      • 1970-01-01
      相关资源
      最近更新 更多