Как изменить размер шрифта в компоненте vuetify

Question

Как изменить размер шрифта в компоненте vuetify

1

Я использую v-text-поле и v-select, с vue-loader.
Я попытался изменить размер шрифта, но не смог. Как изменить размер шрифта?

Мой код нравится это.

<template lang="pug">
p label-1
v-text-field(...)

p label-1
v-text-field(...)
</template>

<stylelang="sass">
.input-group .input-group__input
  font-size: 12px !important
</style>

<stylelang="sass"scoped>
.p
  font-size: 12px
</style>

скриншот разработчика

tomlla 27 окт. 2017, в 06:52

Источник

Теги:

javascript

vue.js

css

vuetify.js

3 ответа

0

Чтобы изменить размер шрифта для одного компонента, например text field, для всего приложения:

<style>
  .v-text-field input {
    font-size: 1.2em;
  }
</style>

Чтобы изменить размер шрифта в другом компоненте, используйте стиль с областью:

<style scoped>
  .v-text-field input {
    font-size: 1.2em;
  }
</style>

Для более общего подхода вы также можете настроить таргетинг на несколько типов компонентов с использованием .v-input

.v-input {
    font-size: 1.2em;
}

или же

.v-input input {
    font-size: 1.2em;
}

Наконец, вы также можете настроить таргетинг на метки.

.v-input .v-label {
    font-size: 1.2em;
}

Steven Spungin 05 окт. 2018, в 10:10

0

или вы можете создать класс div и указать это.

<style lang="stylus" scoped>
  .element
    color white    
    padding 0
    margin 0
    font-size 150%
</style>

.element
      | 一共 : {{ sum("quantity") }} ，....

Raju yourPepe 29 окт. 2017, в 05:19

Ещё вопросы

Nisal Edu · Accepted Answer · 2017-10-27T02-31-00.000Z

Установите семейство шрифтов на тело. Если вы импортируете запись стилуса Vuetify, main.styl перезапишет переменную $ font-family.

Он спросил о размере шрифта, а не о семействе шрифтов