使 select 选项在 q-select 类星体中变大

Question

我正在使用 q-select 来显示月份，但字体很小，所以我想把选项调大一些。我尝试在 css 中更改字体大小，但没有成功。

我的 select atm

          <q-select
            ref="month"
            input-style="zoom: 1.2; text-align: right;"
            rounded outlined
            clearable
            class="text-h4" 
            v-model="oMonth" 
            :options="oMonths"
          />

输出是什么样的 months selection

Answer 1

您需要影响弹出菜单及其选项外观的 <q-select> 属性是 popup-content-class and/or popup-content-style。（如果您需要对每个项目的内容进行更多控制，也可以使用 option 槽。）

对于 h6 大小的文本，按照这些思路行事：

          <q-select
            ref="month"
            input-style="zoom: 1.2; text-align: right;"
            rounded outlined
            clearable
            class="text-h4" 
            popup-content-class="text-h6"
            v-model="oMonth" 
            :options="oMonths"
          />

使 select 选项在 q-select 类星体中变大

Make select options larger in q-select quasar

javascript

select

font-size

quasar-framework