Javascript 如何在 vuetify 组件中更改字体大小
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/46967557/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How Do I change font-size in vuetify component
提问by tomlla
I use v-text-field, and v-select, with vue-loader.
I tried to change font-size, but I could not.
How Do I change font-size?
我将 v-text-field 和 v-select 与 vue-loader 一起使用。
我试图改变字体大小，但我不能。如何更改字体大小？
My code likes this.
我的代码喜欢这个。
<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>
采纳答案by Nisal Edu
Set the font-family on body. If you are importing the Vuetify stylus entry, main.styl overwrite the $font-family variable.
在 body 上设置 font-family。如果您要导入 Vuetify stylus 条目，则 main.styl 会覆盖 $font-family 变量。
回答by Steven Spungin
To change the font size for a single component, such as a text field, application-wide:
要更改单个组件的字体大小，例如text field，应用程序范围：
<style>
.v-text-field input {
font-size: 1.2em;
}
</style>
To change the font size within another component, use a scoped style:
要更改另一个组件中的字体大小，请使用作用域样式：
<style scoped>
.v-text-field input {
font-size: 1.2em;
}
</style>
For a more generic approach, you can also target multiple component types using .v-input
对于更通用的方法，您还可以使用 .v-input
.v-input {
font-size: 1.2em;
}
or
或者
.v-input input {
font-size: 1.2em;
}
Finally, you can also target the labels as well.
最后，您还可以定位标签。
.v-input .v-label {
font-size: 1.2em;
}
回答by Raju yourPepe
or you can create a div class and point this out.
或者您可以创建一个 div 类并指出这一点。
<style lang="stylus" scoped>
.element
color white
padding 0
margin 0
font-size 150%
</style>
.element
| 一共 : {{ sum("quantity") }} ，....
回答by DevonDahon
This example worked for me:
这个例子对我有用：
<style lang="css" scoped>
.v-text-field >>> input {
font-size: 0.8em;
font-weight: 100;
text-transform: capitalize;
}
.v-text-field >>> label {
font-size: 0.8em;
}
.v-text-field >>> button {
font-size: 0.8em;
}
</style>
