如何增加 v-data-table 标题中的字体大小

问题描述

我想将 Vuetify 表 v-data-table 中 的字体大小增加到 20px.但它保持在 12px.

I want to increase the font-size of the <th> to 20px in Vuetify table v-data-table. But it stays at 12px.

我试过了:

table.v-table thead tr th {
  font-size: 20px!important;
}

这是我的数据表:

<v-data-table
        :headers="headers"
        :items="myjson"
        class="elevation-1"
      >
        <template v-slot:items="props">
         <td>{{ props.item.ApplicationType }}</td>
        </template>
</v-data-table>

我希望 thead 的字体大小为 20 像素.但是在检查时它保持在 12px.

I expect the font-size of the thead to be 20px. But it remains at 12px while inspecting.

推荐答案

我遇到了同样的问题.我是这样解决的:

I had the same problem. Here is how I solved it:

table.v-table thead th {
      font-size: 20px !important;

 }

如果你想改变 使用:

If you want to change the <td> using:

table.v-table tbody td {
    font-size: 18px !important;
}

确保全局添加.即在 App.vue 中.

Make sure to add that globally. i.e in App.vue.

我希望它有帮助:)

这篇关于如何增加 v-data-table 标题中的字体大小的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！