我正在尝试修改 vuetify 组件的 css,例如更改 font-size
至10px
,但它没有考虑我的类(class)
有解决办法吗?
最佳答案
我假设您正在使用其中一种预处理器(SASS 或 Stylus)。
所以问题是你可能有样式部分 scoped
例如<style lang="scss" scoped>
.
您想要做的是使用deep选择器,这样父组件中的样式就会泄漏到子组件中,在本例中是vuetify组件。
这可以在 sass 中实现,如下所示:
<template>
<div class="button-wrapper">
<v-btn color="success">Success</v-btn>
</div>
<template>
然后在样式标签中:
<style lang="scss" scoped>
.button-wrapper /deep/ button{
background: #00e389;
color: #fff;
}
</style>
- 注意:我不使用 Stylus,但如果我没有记错的话,deep 的语法是
>>>
所以在这种情况下,它将是.button-wrapper >>> button
。您可以阅读更多相关信息 here in the vue-loader docs
关于vuetify.js - 修改文本字段的css或在vuetify组件中选择,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49259475/