Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
1.4k views
in Technique[技术] by (71.8m points)

vuetify.js - How to change the text color of a Vuetify button?

Maybe I'm missing something obvious, but I can't figure out the proper way to change the text color in a v-btn. This works, but having to use !important doesn't seem ideal:

.v-btn
  color: red !important

The color prop is only for the background color, as far as I'm aware. And I guess I could change the theme primary/secondary when calling Vue.use(Vuetify, { theme: {...}} ), but what if I want to override a single component?

question from:https://stackoverflow.com/questions/52258669/how-to-change-the-text-color-of-a-vuetify-button

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Answer

0 votes
by (71.8m points)

There are css classes for coloring text anywhere in vuetify, just append --text to a color.
So for example

<v-btn class="red--text">

It should work with colors defined in your theme as well e.g. primary--text and similar.
Note that this is not specific to a v-btn, class should work anywhere.


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...