Question

我正在尝试创建Vuetify页脚，但遇到了一些问题。我在https://codepen.io/anon/pen/mYazWv处制作了Codepen。

我是初学者，所以我想看看如何将标题放在中间，并使用太多按钮将右边的复选框和按钮一起推到右侧垫片

我正在关注官方vuetify文档https://vuetifyjs.com/en/components/footer

<v-footer
  height="auto"
  color="primary lighten-1"
>
  <v-card class="flex flat tile"> 
    <v-card-title class="primary lighten-1">
      <v-layout justify-center row wrap>

        <strong class="subheading white--text">
        Some Random Text
      </strong>
      </v-layout>


      <v-spacer></v-spacer>
      <v-spacer></v-spacer>
      <v-spacer></v-spacer>
      <v-spacer></v-spacer>
      <v-spacer></v-spacer>
     <v-spacer></v-spacer>
      <v-spacer></v-spacer>
      <v-spacer></v-spacer>

 <v-checkbox dark label="Click Me"></v-checkbox>
        <v-btn v-on:click="saveClicked">
        <v-icon>save</v-icon> Save
      </v-btn>
        <v-btn>
          <v-icon>close</v-icon> Cancel
        </v-btn>
      </v-card-title>
    </v-card>

v-spacer将按钮推入到位，但似乎不适用于复选框。任何帮助将不胜感激。

Answer 1

将grow类添加到<v-layout>。
将shrink类添加到<v-checkbox>。

Updated pen。

注意：要将标题向左对齐，请从flex中删除justify-center和<v-layout>类。

如何将文字集中在vuetify页脚上？

1 个答案: