Vue.js 在vuetify中更改网格中的列宽

我在行下面有三列，每列的cols值为4。我想减小“col1”的宽度，我试图将cols值从4更改为3，但列比我预期的要小。所以我想要一个介于3到4之间的cols值（考虑cols值为3.5）。有没有办法让我做到这一点

<div id="app">
  <v-app id="inspire">
    <v-container class="grey lighten-5">
      <v-row no-gutters>
        <v-col cols="4">
          <v-card>col1</v-card>
        </v-col>
        <v-col cols="4">
          <v-card>col2</v-card>
        </v-col>
        <v-col cols="4">
          <v-card>col3</v-card>
        </v-col>
      </v-row>
    </v-container>
  </v-app>
</div>

可乐
可乐
可乐

正如@Matthias所指出的，它是基于引导的，但使用实现。每个“行”将始终具有12个大小相同的“列”，其宽度基于网格容器的宽度（尽管

v-col

元素可以跨越多个“列”）例如，

Vuetify与bootstrap一样，使用12点网格。这意味着对于1-12之间的每个值，都有一个计算出的宽度。您不能简单地使用十进制数字来调整宽度。如果省略宽度，该列将占用剩余的空间。您可以只指定一列作为
cols=“5”
，并将其他2个保留为空？然后其他2个都将共享剩余的7个，使它们都
3.5
。除此之外，我想说的是，默认Vuetify组件没有选项。
one-col-width = (container-width - ((2 * margin-width) + (11 * gutter-width))) / 12

col-width = (one-col-width * cols) + (gutter-width * (cols - 1))