Vuetify vuetify 组件的自定义样式，例如带有 css 的 v-textarea

Question

如何使用 css 定位 vuetify v-textarea 的底层 html textarea？就我而言，我想更改 v-textarea 的行高、字体系列、颜色等。它不是这样工作的：

<v-textarea class="custom-textarea"></v-textarea>

.custom-textarea {
  line-height: 1;
  color: red;
}

我还尝试了其他几个选择器，例如v-textarea, .v-textarea，v-text-field__slot但这些都不起作用。文本区域的正确选择器是什么？

Answer 1

为了覆盖深层元素，您需要通过深层选择器访问该元素，例如

::v-deep .v-textarea textarea

有关深度选择器的更多信息