Question

我在codepen上使用了vuetify1.5.x。正如您在我的Codepen中所看到的，关于自动完成的内容很粗。我只希望那条线只有1px。我希望该选择字段（轮廓边框）为border: 1px solid red。我尝试检查元素并查看该类，然后编写如下代码：

.theme--light.v-select-list v-card {
  border: 1px solid red;
}

此代码无效。我尝试使用此代码的另一种方式：

theme--light.v-select-field--outline > .v-input__control > .v-input__slot {
  border: 1px solid red;
}

此代码也不起作用。我该怎么办？

Answer 1

覆盖全局或组件style

.v-text-field--outline.v-input--has-state>.v-input__control>.v-input__slot, 
.v-text-field--outline.v-input--is-focused>.v-input__control>.v-input__slot,
.theme--light.v-text-field--outline:not(.v-input--is-focused):not(.v-input--has-state)>.v-input__control>.v-input__slot:hover {
    border: 1px solid !important;
}
.theme--light.v-text-field--outline>.v-input__control>.v-input__slot {
    border: 1px solid !important;
}

更改边框自动完成功能

1 个答案: