css - Vuetify v-tooltip 无法更改 css

Question

我正在使用 vuetify 的 v-tooltip，我想对其 css 进行细微更改，例如不透明度 = 1 和内部填充 0。但我无法更改其上的任何 css。有人可以帮忙吗？

.v-tooltip {
font-size: 50px !important;
opacity: 1 !important;

}

这是我的 vue 代码

    <v-tooltip bottom>
                        <template v-slot:activator="{ on }">
                            <a
                                v-on="on"
                                @mouseover="mouseOver(item)"
                                @mouseleave="mouseLeave(item)"
                            >{{item.name}}</a>
...continued

Answer 1

内容在 .v-tooltip__content 下。它也是在元素本身上设置的，因此需要 important ，因为您已经覆盖了样式。

.v-tooltip__content {
  font-size: 50px !important;
  opacity: 1 !important;
  display: block !important;
}