I want to change the font size of "attendance",which is the content of label.
<v-checkbox
v-model="course.evaluation"
label="attendance"
></v-checkbox>
Here is what I've tried. Inside the same vue file, I added
<style>
.v-checkbox.v-label {
font-size: 10px;
}
</style>
But it didn't work. Anyone can help?
Try increasing priority by adding chaining selectors
Add a class
to the checkbox
<v-checkbox
class="my-checkbox"
v-model="course.evaluation"
label="attendance"
></v-checkbox>
Then
<style>
.my-checkbox .v-label {
font-size: 10px;
}
or In case it still doesn't reflect the override then use deep selector
::v-deep .my-checkbox .v-label {
font-size: 10px;
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With