0

使用 Quasar Framework 0.15，我看不到对使用 Flex 相关类有任何影响。一个简单的组件：

<template>
  <q-page class="flex">
    <div class="row">
      <div class="col-sm-6 justify-center">
        <q-btn-group>
          <q-btn label="1" />
          <q-btn label="2" />
          <q-btn label="3" />
        </q-btn-group>
      </div>
    </div>

  </q-page>
</template>

当我检查组件时，例如“row”类的 div 没有像预期的那样具有全宽，似乎没有任何其他与 Flex 相关的类，如“justify-start”或“col-sm-6”去工作。

在这种情况下，我的 btn 组显示在屏幕的左上角，好像没有应用 css（'justify-center' 应该居中）

我正在全新安装中运行 web/material 主题。

4

1 回答 1

1

您可以使用没有任何类的简单 q-page，它将占用全宽。您还可以使用固定中心类来居中内容。

<template>
  <q-page>
    <div class="row">
      <div class="col-sm-6 fixed-center">
        <q-btn-group>
          <q-btn label="1" />
          <q-btn label="2" />
          <q-btn label="3" />
        </q-btn-group>
      </div>
    </div>

  </q-page>
</template>
于 2018-09-24T17:36:32.233 回答